Bucle

[dukeblass]

Buenas, una duda, tengo una lista ul

Código HTML:

<ul id="lista">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>
</ul>
 

el dilema es poder darles eventos a los item por javascript:

intente con un for:

Código Javascript:

elm = document.querySelectorAll('#lista > li');
    for(e=0;e<elm.length-1;e++){
      elm[e].addEventListener('click', function(){
          console.log('click en '+elm[e].innerHTML);
      }, false);
    }
 

y la respuesta es simpre para el ultimo item (tanto en este no funciona).


como hacer algo asi.

[Dradi7]

Iniciado por dukeblass

Buenas, una duda, tengo una lista ul

Código HTML:

<ul id="lista">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>
</ul>
 

el dilema es poder darles eventos a los item por javascript:

intente con un for:

Código Javascript:

elm = document.querySelectorAll('#lista > li');
    for(e=0;e<elm.length-1;e++){
      elm[e].addEventListener('click', function(){
          console.log('click en '+elm[e].innerHTML);
      }, false);
    }
 

y la respuesta es simpre para el ultimo item (tanto en este no funciona).


como hacer algo asi.

Solo cambia tu JS por esto

Código Javascript:

var elm = document.querySelectorAll('#lista > li');
for(e=0;e<elm.length;e++){
   elm[e].addEventListener('click', function(){
          console.log('click en '+this.innerHTML);
   }, false);
};
 

[dukeblass]

Gracias, Dradi7, me faltaba ese this, ya había echo algo así pero no me acordaba de como.. XD

[dontexplain]

El soporte básico para querySelectorAll es para las versiones mínimas:

Chrome 1
Firefox 3.5 (1.9.1)
Internet Explorer 8
Opera 10
Safari 3.2 (525.3)

En las versiones anteriores ese método no funcionará.

Un saludo.