无意间创建的一个闭包，以及解决的方法

闭包的本质是作用域链，我们在工作中常常无意间就会创建一个闭包，比方：

<input type="button" id="id1" value="1"></input>
<input type="button" id="id2" value="2"></input>
<input type="button" id="id3" value="3"></input>
<input type="button" id="id4" value="4"></input>
<input type="button" id="id5" value="5"></input>
<input type="button" id="id6" value="6"></input>
<input type="button" id="id7" value="7"></input>
<input type="button" id="id8" value="8"></input>
<input type="button" id="id9" value="9"></input>
<input type="button" id="id10" value="10"></input>
<script type="text/javascript">
for (var i = 1; i <= 10; i++)
{
   document.getElementById("id"+i).onclick = function () 
    {
        alert(i);
    }
}
</script>

执行之后，会发现每一个onclick时间执行时弹出的都是11!

这是由于，onclick 函数是在 全局作用域里面被定义的，被定义的时候。会生成一个对象。这个对象继承了当前运行环境的作用域链。也就是说。这个函数运行体里的 i 。引用的是全局作用域里的i。

由于 for 循环运行完以后，全局作用域下的 i 的值变为了 11，所以才会每一个onclick函数都弹出11。

为了解决问题，我们须要为每一个 onclick 函数的生成建立一个单独的作用域。然后 onclick 函数弹出这个作用域里面的 局部变量：

<input type="button" id="id1" value="1"></input>
<input type="button" id="id2" value="2"></input>
<input type="button" id="id3" value="3"></input>
<input type="button" id="id4" value="4"></input>
<input type="button" id="id5" value="5"></input>
<input type="button" id="id6" value="6"></input>
<input type="button" id="id7" value="7"></input>
<input type="button" id="id8" value="8"></input>
<input type="button" id="id9" value="9"></input>
<input type="button" id="id10" value="10"></input>
<script type="text/javascript">
for (var i = 1; i <= 10; i++)
{
    (function () {
        var m;
        m = i;
        document.getElementById("id"+m).onclick = function () 
        {
            alert(m);
        }
    })();
}
</script>