js变量存储问题

<script> var ul=document.getElementById('demo'); var oLi=ul.getElementsByTagName('li'); for (var i = 0; i < oLi.length; i++) { oLi[i].onclick=function(){ alert(i); } } </script> 那么当我们点击第一个li就会弹出0，点击第二个就会弹出1……真的是这样吗？当我们去实践的时候就会发现，每次弹出的，都是5！！！ 为什么会这样呢？ 因为当代码执行到这里的时候，i已经变成5了，也就是说，我们还没来得及点击，i已经变成5了，这时候再点击弹出的当然只能是5。你说为什么是5，而不是4，i明明只会增长到4啊！这个我也不知道为什么，如果你知道麻烦告诉我。 那么解决办法是什么呢？ <script> var ul=document.getElementById('demo'); var oLi=ul.getElementsByTagName('li'); for (var i = 0; i < oLi.length; i++) { (function(n){ oLi[n].onclick=function(){ alert(n); } })(i); } </script>

for(var i = 0; i < lis.length; i++){ lis[i].index = i; lis[i].onclick = function(){

alert(this.index+1);
}
}