js回调的一个疑惑

昨天，在用js时遇到了一个问题，代码如下

$(document).ready(function(){ 
     for(var i = 0 ; i < 5; i++){ 
          $("#button"+i).bind("click",function(){ 
              alert(i); 
          }); 
     } 
});

很简单的一个bind，结果每个button的click都是alert出5。当时很疑惑，为什么不是0,1,2,3,4？

然后我就去问答问了一下，结果有位小伙伴就跟我说这是js闭包问题，然后我又去看了一下js闭包

请看这篇博文js中的闭包之我理解，特别是里面的一句“闭包中所记录的自由变量,只是对这个变量的一个引用,而非变量的值,当这个变量被改变了,闭包里获取到的变量值,也会被改变.”，这就解决了我当前的疑惑。

然后是针对上面问题的解决思路，

思路1    在外部定义一个返回值为function的方法，然后再bind里调用外部定义的方法，并将i传过去

for(var i = 0 ; i < 5; i++){ 
          $("#button"+i).bind("click", callback(i)); 
     } 

function callback(i){
    return function(){
        alert(i);
    }
}

思路2（上面那位小伙伴提供），放弃id选择器，把id当成一个属性，然后利用startWith过滤器选择到这些东西，然后each枚举通过解析id的具体值来完成事件的绑定。

$("*[id^='b']).each(function(index, data){
<pre>    var i = $(data).id().substring(1);
    $(data).bind("click", function(){alert(i);});
});

关于闭包问题，有时间再好好深入了解一下