Javascript 对jQuery插件的操作始终是最后一个选项？

我正在编写的插件是一个内部应用程序的右键单击上下文菜单，我不明白为什么会发生这种情况

以下是我的测试代码：

$('.item').rightClickMenu([
{
  icon:'http://cdn1.iconfinder.com/data/icons/silk2/exclamation.png',
  title:'Alert',
  action:function(){
    alert('Here is an example alert!');
  }
},
{
  icon:'http://cdn1.iconfinder.com/data/icons/silk2/error.png',
  title:'Console.Log',
  action:function(){
    console.log('Here is an example console.log()!');
  }
}
]);

相关的jQuery插件代码是：

for(x in items){
          $list.append('<li class="rightClickMenuOption'+x+'"><img src="'+items[x].icon+'">'+items[x].title+'</li>')
            .find('.rightClickMenuOption'+x)
              .bind('click',function(){
                items[x].action();
              });
        }

用于（项目中的x）{
$list.append（“
“+items[x].title+”
”）
.find（'.rightClickMenuOption'+x）
.bind（'单击'，函数（））{
项[x]。操作（）；
});
}

演示：

这将修复它：

您正在创建一个闭包。在循环中，..in的

中调用的所有方法将相同的父上下文从其激活对象复制到内部
[[Scope]]
属性中。因此，所有方法都访问相同的变量
x
。您需要调用另一个函数来修复此问题

for(x in items){
      (function(index) {
        $list.append('<li class="rightClickMenuOption'+index+'"><img src="'+items[index].icon+'">'+items[index].title+'</li>')
          .find('.rightClickMenuOption'+index)
            .bind('click',function(){
              items[index].action();
            });
      }(x));
}

用于（项目中的x）{
（功能（索引）{
$list.append（“
”+项[index].title+”
”）
.find（'.rightClickMenuOption'+索引）
.bind（'单击'，函数（））{
项目[索引]。操作（）；
});
}（x） ）；
}

更新

看看

这将非常令人印象深刻地演示
for
和
for..之间的速度差。在
中，这将解决此问题：

您正在创建一个闭包。在
循环中，..in
的
中调用的所有方法将相同的父上下文从其激活对象复制到内部
[[Scope]]
属性中。因此，所有方法都访问相同的变量
x
。您需要调用另一个函数来修复此问题

for(x in items){
      (function(index) {
        $list.append('<li class="rightClickMenuOption'+index+'"><img src="'+items[index].icon+'">'+items[index].title+'</li>')
          .find('.rightClickMenuOption'+index)
            .bind('click',function(){
              items[index].action();
            });
      }(x));
}

用于（项目中的x）{
（功能（索引）{
$list.append（“
”+项[index].title+”
”）
.find（'.rightClickMenuOption'+索引）
.bind（'单击'，函数（））{
项目[索引]。操作（）；
});
}（x） ）；
}

更新

看看

这将非常令人印象深刻地演示
for
和
for..in
中的
之间的速度差，请使用正常的
for
循环，而不是
for..in
<代码>项
是一个数组。但无论如何+1:）太棒了！你太棒了。当StackOverflow告诉我：）@Felix，我听说很多关于不使用…in的信息，但我仍然不明白为什么。你能给我指点东西解释一下为什么你不该这么做吗？我想知道，只是好像什么都找不到：\@奥斯卡：不客气。你也应该听从Felix Kling的建议。使用普通的
for循环
在数组上迭代更合适。一个很好的理由是，
for..in
比
for
或
while
循环要慢得多。@Oscar Godson:看看这里：基本上，
for..in
用于迭代对象属性。由于数组也是对象，如果您在数组上指定自定义属性，您也将迭代该属性，这不是您想要的（以及其他东西）。只需对对象使用
for…in
，对数组使用
for
。如果您不想写这么多，并且顺序无关紧要，您可以将for循环写为
for（var i=items.length；i--；）
请使用正常的
for
循环，而不是
for…in
<代码>项
是一个数组。但无论如何+1:）太棒了！你太棒了。当StackOverflow告诉我：）@Felix，我听说很多关于不使用…in的信息，但我仍然不明白为什么。你能给我指点东西解释一下为什么你不该这么做吗？我想知道，只是好像什么都找不到：\@奥斯卡：不客气。你也应该听从Felix Kling的建议。使用普通的
for循环
在数组上迭代更合适。一个很好的理由是，
for..in
比
for
或
while
循环要慢得多。@Oscar Godson:看看这里：基本上，
for..in
用于迭代对象属性。由于数组也是对象，如果您在数组上指定自定义属性，您也将迭代该属性，这不是您想要的（以及其他东西）。只需对对象使用
for…in
，对数组使用
for
。如果您不想写这么多，并且顺序无关紧要，那么可以将for循环编写为
for（var i=items.length；i--；）