javascript中for循环传参解决办法————呱呱二号
按常理循环绑定事件，但是得到的结果却不是想要的，下面有个不错的示例，可以为大家详细分解下
今日做购物车的时候，用到了一个for循环绑定多个点击事件的时候，传参时没有预期的结果。
代码如下：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
</body>
</html>
<script>
for(var i = 0;len = pArr.length,i < len;i++){
pArr[i].onclick = function(){
alert(i);
}
}
</script>
然而每次弹出来的都是1
这样我很慌的。
后来找度娘，google才知道是这么一回事：
函数变量作用域问题，如果把function() { alert(i); return false; } 当做一个函数 a();a()内部未定义变量i,但是内部使用了，于是向外查找,找到for循环里定义的i，点击事件是for循环完毕后才开始执行的，执行完毕后i的值已经变成-1；所以每次弹出的都是-1；
解决办法很多！！！！
1
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
(function(i){
as[i].onclick = function() {
alert(i);
}
})(i)
}
2
var as = document.getElementsByTagName('a');
for ( var i = as.length; i--; ) {
var a = function(i){
as[i].onclick = function() {
alert(i);
return false;
}
}
a(i);
}
3,将变量i保存在每个段落对象 p 上
function init() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i<pArr.length; i++ ) {
pArr[i].i = i;
pArr[i].onclick = function() {
alert(this.i);
}
}
}
4、将变量 i 保存在匿名函数自身
function init2() {
var pArr = document.getElementsByTagName("p");
for( var i=0; i<pArr.length; i++ ) {
(pArr[i].onclick = function() {
alert(arguments.callee.i);
}).i = i;
}
}
5、加一层闭包，i以局部变量形式传递给内存函数
function init4() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i<pAry.length; i++ ) {
(function () {
var temp = i;//调用时局部变量
pAry[i].onclick = function() {
alert(temp);
}
})();
}
}
6、加一层闭包，返回一个函数作为响应事件（注意与1的细微区别）
function init5() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i<pAry.length; i++ ) {
pAry[i].onclick = function(arg) {
return function() {//返回一个函数
alert(arg);
}
}(i);
}
}
7、用Function实现，实际上每产生一个函数实例就会产生一个闭包
function init6() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i<pAry.length; i++ ) {
pAry[i].onclick = new Function("alert(" + i + ");");//new一次就产生一个函数实例
}
}
8、用Function实现，注意与7的区别
function init7() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i<pAry.length; i++ ) {
pAry[i].onclick = Function('alert('+i+')')
}
}
好了，，，
浙公网安备 33010602011771号