关于JS闭包的概念和是应用这里不说，只针对个人理解做一个简单测试，如果回答正确，并且知道什么回事，说明对闭包的原理掌握差不多了。
请看题：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script type="text/javascript">
function f1() {
var arr = document.getElementsByTagName("p");
for( var i=0; i<arr.length; i++ ) {
arr[i].onclick = function() {alert(i); }
}
}
</script>
</HEAD>
<body onload="f1();">
<p>点击我 0</p>
<p>点击我 1</p>
<p>点击我 2</p>
<p>点击我 3</p>
</body>
</HTML>
试着回答一下上面代码点击的时候后会弹出什么值 ？
如果是0，1…… 那就错了(刚开始我也错了 ^_^)
正确答案是4.
什么原因？ 自己在网上搜索一下JS变量作用域就明白了（其实我也说不清楚 ……）
解决方案
其实解决的方法有好几种，比如隐藏域，我要说的是闭包的方式
请看代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script type="text/javascript">
function f1() {
var arr = document.getElementsByTagName("p");
for( var i=0; i<arr.length; i++ ) {
arr[i].onclick = (function(k){ return function(){ alert(k); } })(i); //这个变了
}
}
</script>
</HEAD>
<body onload="f1();">
<p>点击我 0</p>
<p>点击我 1</p>
<p>点击我 2</p>
<p>点击我 3</p>
</body>
</HTML>
运行代码看看。 果然正确了。
至于为什么，Google一下就明白 呵呵。
还有一个……
这个例子看的别人的，不过很典型拿来用用 ^^
他涉及到this关键字的用法，看仔细了
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script type="text/javascript">
var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};
alert(object.getNameFunc()());
</script>
</HEAD>
<body >
</body>
</HTML>
猜结果什么？
答案： “The Window”
其他的不说了，如果能明白上面两个例子，闭包应用可以小试牛刀了 哈哈……