javascript - 使用 jquery conextmenu 的参数调用函数

Question

我正在从 jquery-contextmenu sumbenu 调用一个函数，根据单击的选项传递特定参数。

我根据 js 对象生成该子菜单，其中包含三个名称。假设当我单击其中之一时，我的函数会以该名称作为参数调用，然后将其打印在控制台上。

但它仅使用最后一个元素调用该函数，我不知道为什么。当我点击“john”或“Matt”时，它只显示“you press Petter”。

就像这张图片上一样:

即使我从未点击过“Petter”，它也只会显示“您按下了 Petter”。

代码(我可以把 fiddle 放在这里，但我没有找到 jquery contextmenu 链接，如果您将其分享给我，如果存在的话，我会很高兴):

var obj = {"1":"john","2":"Matt","3":"Petter"};

function myFun(name){
    console.log("you pressed "+name);
}

$(function() {
$.contextMenu({
  selector: '.context-menu-one',
  autoHide: true,
  build: function($trigger, e) {
    var options = {
      items: {}
    }

    options.items["users"] = {name: "users", icon: "fa-circle", items: {}}

    for(var i in obj){
      options.items["users"].items[obj[i]] = {name: obj[i], icon: "fa-user", callback: function(){
        myFun(obj[i]);
      }}
    }

    return options;
  }
});
});

抱歉我的英语不好，谢谢。

Answer 1

这是由于 javascript 语言中的闭包所致。回调中对变量 i 的引用将像以前一样在作用域外存储和调用，但是，循环将运行到全局作用域的 i，将始终等于最后一个索引。要解决此问题，请将循环更改为这样工作

for(var i in obj){
  (function(j) {
    options.items["users"].items[obj[j]] = {name: obj[j], icon: "fa-user", callback: function(){
        myFun(obj[j]);
      }
    }
  })(i);
}

这会在函数内创建一个新的作用域，使循环保持闭包，并使 i 的值等于当前迭代的索引，从而使菜单能够正常工作。