当前位置： 移动技术网 > IT编程>开发语言>JavaScript > JS中响应函数和for循环执行问题

JS中响应函数和for循环执行问题

2020年04月22日  | 移动技术网IT编程  | 我要评论

一个简单的html页面，点击delete可以进行删除操作。现在分析其部分的响应函数和for循环的问题，其余省略。

 

给出其html代码：

<body>
    <table id="employeetable" border="1" cellspacing="0">
        <tr>
            <th>name</th>
            <th>email</th>
            <th>salary</th>
            <th>&nbsp</th>
        </tr>
        <tr>
            <td>tom1</td>
            <td>tom@tom.com</td>
            <td>5000</td>
            <td><a href="#">delete</a></td>
        </tr>
        <tr>
            <td>tom2</td>
            <td>tom@tom.com</td>
            <td>5000</td>
            <td><a href="#">delete</a></td>
        </tr>
        <tr>
            <td>tom3</td>
            <td>tom@tom.com</td>
            <td>5000</td>
            <td><a href="#">delete</a></td>
        </tr>
    </table>
</body>

仔细分析js代码：

<script>
        window.onload = function () {
            //获取所有的超链接
            var alla = document.getelementsbytagname("a");
            
            //为每一个超链接绑定一个单击响应函数
            for (var i = 0; i < alla.length; i++) {
               alla[i].onclick = function () {

                    alert(alla[i]);               
                }
            }
        }
 </script>

当在浏览器点击delete的时候，会出现如下结果：

这里为什么不是alla[i]呢？继续看下面的代码：

 <script>
        window.onload = function () {
            //获取所有的超链接
            var alla = document.getelementsbytagname("a");
            
            //为每一个超链接绑定一个单击响应函数
            for (var i = 0; i < alla.length; i++) {

                alert("for循环正在执行"+i);

                alla[i].onclick = function () {

                    alert("响应函数正在执行"+i);
     
                }
            }

        }
    </script>

 原来for循环会在页面加载完就立即执行，而响应函数是在点击的时候才会执行，此时i经过for循环已经成为3了，超过了数组下标，所以显示undefined。

 

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网