循环中的jquery函数不迭代

Question

我的代码存在问题，title属性仅显示16，而不是显示1到15的所有值。为什么这样可以让任何人建议我做错了什么？

我的代码

 x=1;
 while(x <= 15)
 {
     $("td#id"+x).mouseover(function(x){
     $(this).attr('title', x)           
   });
   x++;
}

Answer 1

这是非常常见的“在回调中使用循环变量”问题。

当您使用jQuery时，最简单的修复是处理程序的data参数：

 var x=1;
 while (x <= 15) {
     $("td#id"+x).mouseover({ x: x }, function(ev) {
         this.title = ev.data.x;        
     });
     x++;
 }

那就是说，你为什么只在mouseover函数中设置它？标题应该直接添加到元素中，只需一次：

for (var x = 1; x <= 15; ++x) {
    document.getElementById('id' + x).title = x;
}

在mouseover处理程序中执行此操作实际上不会破坏任何内容，但这意味着您已经注册了一个事件处理程序，每次从一个单元格移动时都会反复调用（并更新DOM）到另一个。

Answer 2

您为jquery提供的函数作为事件处理程序保存指向定义它的外部块及其（生存）变量的指针。这就是关闭工作的方式。

因此，当它被执行时，x是15。

我知道大多数javascript开发人员都不知道它是如何工作的，但这是一个非常有趣的事情要知道：http://jibbering.com/faq/notes/closures/

编辑：我不会在这里添加我打算添加的常规修复，因为Alnitak在我面前指出事实上回调实际上在这种情况下完全没用;）