前端 JavaScript 开发中，我们经常会遇到为某些节点绑定相同事件的情况，代码如下：
$(function(){
for(var i=0;i<5;i++){
$(".testt p:eq("+i+")").click(function(){
alert(i);
})
}
})
上述代码意在为 class="testt" 的 <ul> 下的五个 <li> 节点循环绑定点击事件，但运行结果事与愿违。无论我们点击任意 <li> 节点，弹窗的内容永远都是 5 ，即便我们是在 DOM 节点加载完成后才进行的事件绑定。
这里其实就涉及到 javascript 函数执行顺序的问题：当我们通过 for 函数进行事件的循环绑定时，javascript 内部并不是马上就对其执行绑定的，而是当我们激活绑定事件时才进行真正意义上的绑定。因此此时的 i 已经不再是 0 而变成了 5 。为此，我们需要将函数在绑定时就执行一遍。
PS：这里所说的执行并非真正意义上的执行激活事件，而是通过 javascript 自执行函数的形式将每一个函数与其对应的变量确定下来。
代码如下：
$(function(){
{
for(var i=0;i<5;i++){
(function (i) {
$(".testt p:eq("+i+")").click(function(){
alert(i);
})
})(i)
}
}
})
修改为上述代码后，当我们点击不同的 <li> 时，将会弹出不一样的结果。故证明所有 <li> 事件绑定成功。
PS：上述代码中涉及到 自执行匿名函数 相关知识点，不懂的同学请自行度娘。
