7
1141<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul id="nav_ul">
<li><a href="">1</a></li>
<li><a href="">2</a></li>
<li><a href="">3</a></li>
<li><a href="">4</a></li>
</ul>
<script type="text/javascript">
var a = document.getElementById("nav_ul").getElementsByTagName("a");
for (var i = 0; i < a.length; i++) {
a[i].onclick = function() {
alert(i);
}
}
</script>
</body>
</html>
上面代码中，无论点击那个连接，都是提示4，这个可以理解，但是将onclick放入单独函数中却正常，如下
<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul id="nav_ul">
<li><a href="">1</a></li>
<li><a href="">2</a></li>
<li><a href="">3</a></li>
<li><a href="">4</a></li>
</ul>
<script type="text/javascript">
var a = document.getElementById("nav_ul").getElementsByTagName("a");
for (var i = 0; i < a.length; i++) {
yy(i);
}
function yy(i) {
a[i].onclick = function() {
alert(i);
}
}
</script>
</body>
</html>
如上，点击连接正常，请问这是什么原因？是js的函数有什么特别之处吗？
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
关键词：闭包。
供参考：javascript深入理解js闭包
都是闭包惹的祸啊，改下吧。
var a = document.getElementById("nav_ul").getElementsByTagName("a"); for (var i = 0; i < a.length; i++) { a[i].onclick = (function(_i) { return function() { alert(_i); }; })(i); }这个问题我写的比较详细，可以在这篇文章的最后部分“循环中的闭包”章节找到答案。
你在点击的时候，循环已经执行完毕了，这个时候你的i始终是4了，你点击当然是4了，你可以对元素判断，循环比较元素就可以了.
lz可以写coffeescript的代码，然后生成js，对我这种js半吊子，又不想深究的人来说，生成的代码质量比自己写js高很多：
http://coffeescript.org/
这个问题在刚刚开始看PPK谈javascipt的时候就留意过。书里面提到的是JS的局部变量的作用域问题。也可以试试this，
for (var i = 0; i < a.length; i++) { a[i].onclick = function() { alert(this.innerText); } }1.是关包，请在onclick = function () {}的时候返回 return function () { alert( '123' );}
2.变量作用于，a变量在function外，它是全局变量。