<body>
<a>1</a>
<a>2</a>
<a>3</a>
<a>4</a>
<a>5</a>
<a>6</a>
<a>7</a>
<a>8</a>
<a>9</a>
<a>10</a>
<a>11</a>
<a>12</a>
</body>
var a =document.getElementsByTagName("a");
for(var i=0;i<a.length;i++){
a[i].οnclick=function(){
alert(i);
}
}
上述的这段代码:当你想要实时的捕捉a标签的值,可能都会跟我一样遇到这样的问题。原本以为简单写一个for循环就可以解决问题,却没想到onclick是异步调用,
所以不管怎么尝试,输出的i值都是for完整执行后的i值。
简单的利用闭包就可以解决这个问题:
window.onload = function(){
var a = document.getElementsByTagName('a');
for( var i = 0; i < a.length; i++ ){
(function (n){
a[n].onclick = function(){
console.log( n );
};
}(i));
}
};
闭包的局部作用域,每执行一个for就执行一次匿名函数,有自己的运行环境跟作用域链,所以一个变量就记录一个实时的值 。
文章参考自:http://www.jianshu.com/p/b394939add0b