js 循环监听

发布于
2016-04-15

为什么取不到id

<body>
    <ul>
        <li id="li_8" style="border: 1px solid red;">1</li>
        <li id="li_5" style="border: 1px solid red;">2</li>
        <li id="li_10" style="border: 1px solid red;">3</li>
    </ul>
</body>
<script>
    var li = document.querySelectorAll("li");
    for(var i = 0; i < li.length; i++){
        li[i].addEventListener('click',function(){
            alert(li[i].getAttribute('id'));
        });
    }
</script>

javascript

阅读 6.1k

10 个回答

papersnake

✓ 已被采纳

别用for 用foreach

[].forEach.call(document.querySelectorAll("li"),function(elem,i){
    elem.addEventListener('click',function(){
        console.log(this.getAttribute('id'));
    });
});

静逸秋水

2.6k127

发布于
2016-04-15

楼主可以试下打印出i哈哈！

同楼上，建议foeach

var lis = document.querySelectorAll("li");
lis.forEach(function(item,index) {
    item.onclick = function() {
        alert(index);    
    }
})

cool_zjy

5.6k3723

发布于
2016-04-15

经典的闭包问题

var li = document.querySelectorAll("li");
for(var i = 0; i < li.length; i++){
    li[i].addEventListener('click', (function(){
        return function(){alert(li[i].getAttribute('id'));}
    })());
}

或

var li = document.querySelectorAll("li");
for(var i = 0; i < li.length; i++){
    li[i].addEventListener('click',function(){
        alert(this.getAttribute('id'));
    });
}