这是一道网上的题目,对于刚学习javaScript的我有点混乱。
题目:什么是闭包?以下代码点击<p> 会输出什么?为什么?能大概说明白的话继续问能想出几种解决办法。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>闭包演示</title>
<style type="text/css">
p {background:gold;}
</style>
<script type="text/javascript">
function init() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i<pAry.length; i++ ) {
pAry[i].onclick = function() {
alert(i);
}
}
}
</script>
</head>
<body οnlοad="init();">
<p>产品 0</p>
<p>产品 1</p>
<p>产品 2</p>
<p>产品 3</p>
<p>产品 4</p>
</body>
</html>
要知道,onclick后面函数的代码要等到你点击对应段落的时候才会执行,而到那个时候i的值等于5.所以你点击每个段落都是提示5。
解决办法使用闭包:
pAry[i].onclick = (function (msg){
function show(){
alert(msg);
}
return show;
})(i);
这样就将每一行的序号绑定到对应的显示函数上面了。