带有变量的事件处理程序上的运行时函数声明正在执行处理程序函数

Question

我有一个函数可以向表中添加一些行，最后有一个扩展器。 首次呈现页面时，有30行，并且通过鼠标单击触发扩展器，因为文档标记中内联描述了onclick();事件。

当我添加新的onclick();时，我在循环中这样做，通过一些JSON加载接下来的30个对象，我通过XHR。

newCell.onclick = (function(id){toggleCertificate(id, this, i);})(currCert['id']);

现在currCert包含一个整数'id'我希望在此处理程序中，以便对于每个i，将有一个不同的整数代替currCert['id']，这是toggleCertificate(integer id ...);期望的是什么

newCell.onclick = function(){toggleCertificate(12983, this, 5);};

this需要向下传递，就好像它引用newCell对象一样，其他两个变量需要作为整数向下传递，以便在toggleCertificate执行时将其解释为值

我做错了什么？我发现这种语法非常棘手，只是将函数附加到事件处理程序。

目前，此代码表现为尝试使用无法调试的数据执行“toggleCertificate”。 Firebug的DOM检查器显示附加的onclick成为

(function (){toggleCertificate(currCert['id']), this, i})

页面开始执行所有正确的onclick函数，而不是同时点击。

我希望onclick事件等于此字符串

"toggleCertificate(" + currCert['id'] + ", this, " + i + ");"

很抱歉，如果我使用的任何单词没有正确的JavaScript标准，特别是关于“事件处理程序”，“对象”和“内联”-_-

Answer 1

你需要立即函数来返回一个函数：

newCell.onclick = (function(id, i) {
   return function() {
     toggleCertificate(id, this, i);
   }
})(currCert['id'], i);

onClick需要一个可以在以后执行的函数（当有一个单击时），这就是立即函数的输出必须是什么。使用立即函数的原因是因为附加到onClick的函数是基于i和currCert ['id']

的值以编程方式生成的。