Witam!
Mam taki kod:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Dokument przykładowy</title>
<script type="text/javascript">
const ILOSC = 5;
window.onload = function() {
for(var i=1; i<=ILOSC; i++) {
document.getElementById("p"+i).onclick = function() {
alert("Kliknąłeś na akapit numer " + i);
}
}
}
</script>
</head>
<body>
<div>
<p id="p1">Akapit przykładowy 1</p>
<p id="p2">Akapit przykładowy 2</p>
<p id="p3">Akapit przykładowy 3</p>
<p id="p4">Akapit przykładowy 4</p>
<p id="p5">Akapit przykładowy 5</p>
</div>
</body>
</html>
Dlaczego gdy kliknę na którykolwiek z akapitów, zawszę otrzymuję wiadomość: "Kliknąłeś na akapit numer 6"? Jak ustawić zdarzenia dla wielu elementów w pętli? Wiadomo, że mógłbym ustawić to tak:
<script type="text/javascript">
const ILOSC = 5;
window.onload = function() {
document.getElementById("p"+1).onclick = function() {
alert("Kliknąłeś na akapit numer " + 1);
}
document.getElementById("p"+2).onclick = function() {
alert("Kliknąłeś na akapit numer " + 2);
}
document.getElementById("p"+3).onclick = function() {
alert("Kliknąłeś na akapit numer " + 3);
}
document.getElementById("p"+4).onclick = function() {
alert("Kliknąłeś na akapit numer " + 4);
}
document.getElementById("p"+5).onclick = function() {
alert("Kliknąłeś na akapit numer " + 5);
}
}
</script>
Ale dla przykładowo 50 akapitów, byłoby z tym strasznie dużo roboty.
Pomoże ktoś?