码迷,mamicode.com
首页 > 编程语言 > 详细

javascript循环不能正确输出i值的问题。

时间:2017-10-28 17:48:35      阅读:297      评论:0      收藏:0      [点我收藏+]

标签:str   显示   依次   设置   不能   click   事件对象   一个   color   

 

对于javascript的循环取值是每个开发者都遇到过的问题,例如,下面这个例子我们并不能得到想要的结果:

<body>
 <ul>
    <li>fas</li>
    <li>sf</li>
    <li>fas</li>
    <li>sf</li>
    <li>sf</li>
 </ul>
 <script type="text/javascript">
 <!--
 window.onload=function(){
     var lis=document.getElementsByTagName(‘li‘);
     var i,len=lis.length;
     for ( i=0;i<len ;i++ )
      {
        //alert(i);                                  // 依次为0,1,2,3,4
            lis[i].onclick=function(){
            alert(i);                                           //5
            }
   }
</body>

我们是希望点击每一个li标签都显示它自己的索引值,但由于内部函数调用时外部的 i 时,i 已经循环完毕,值为5,所以不能正确输出,更详细的解释在于此时onclick函数时一个闭包函数,每次引用的时外部函数的最后一个变量。

关于解决放法,有很多中,在此介绍下我自己常用的吧:

方法一:将循环中的 i 值设置为事件对象的属性,在上面的例子中,事件对象就是lis[i];

window.onload=function(){
     var lis=document.getElementsByTagName(‘li‘);
     var i,len=lis.length;
     for ( i=0;i<len ;i++ )
      {
         lis[i].index=i;
        lis[i].onclick=function(){
            alert(this.index);    
        }
      }

方法二:外层加一个立即调用的匿名函数;

 

javascript循环不能正确输出i值的问题。

标签:str   显示   依次   设置   不能   click   事件对象   一个   color   

原文地址:http://www.cnblogs.com/younylight/p/7744894.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!