我正在用Javascript编程。
我需要动态生成onclick事件的事件处理程序。
上面的代码：
for (var i = 1; i < CurrValue; i++) {
getId('btnReadRFIDTag_' + i).onclick = function ()
{
ReadRFIDTag(getId('txtCode_' + i));
};
}
问题显然是在运行时i变量获取最新值而不是正确值。
但我无法解决问题，因为处理程序不允许该函数的参数。
我该如何解决这个问题？
谢谢。
祝你有个美好的一天。
答案 0 :(得分：6)
三个选项：
通常的方法是为处理程序提供构建函数：
for (var i = 1; i < CurrValue; i++) {
getId('btnReadRFIDTag_' + i).onclick = buildHandler(i);
}
function buildHandler(index) {
return function() {
ReadRFIDTag(getId('txtCode_' + index));
};
}
buildHandler构建的函数会关闭index的{{1}}参数，而不会超过buildHandler，因此它会看到正确的值。< / p>
i 如果您可以依赖ES5（或者您包含ES5垫片，因为这是一个可调节的功能），您可以使用Function#bind：
Function#bind像这样使用它会创建不必要的额外功能，所以你也可以像这样使用它：
// Using Function#bind (option 1)
for (var i = 1; i < CurrValue; i++) {
var elm = getId('btnReadRFIDTag_' + i);
elm.onclick = function(index) {
ReadRFIDTag(getId('txtCode_' + index));
}.bind(elm, i);
}
不是在每个按钮上放置一个处理程序，如果它们都在一个容器中（当然，最终它们就是// Using Function#bind (option 2)
for (var i = 1; i < CurrValue; i++) {
var elm = getId('btnReadRFIDTag_' + i);
elm.onclick = myHandler.bind(elm, i);
}
function myHandler(index) {
ReadRFIDTag(getId('txtCode_' + index));
}
），你可以把处理程序放在那个容器上然后使用document.body找出点击的按钮。我不会用旧式event.target做到这一点，但您可以使用onclick或addEventListener：
attachEvent工作方式是通过挂钩容器上的var container = /* ...get the container... */;
if (container.addEventListener) {
container.addEventListener('click', clickHandler, false);
}
else if (container.attachEvent) {
container.attachEvent('onclick', function(e) {
return clickHandler.call(this, e || window.event);
});
}
else {
// I wouldn't bother supporting something that doesn't have either
}
function clickHandler(e) {
var btn = e.target;
while (btn && btn !== this && btn.id.substring(0, 15) !== "btnReadRFIDTag_") {
btn = btn.parentNode;
}
if (btn && btn !== this) {
ReadRFIDTag(getId('txtCode_' + btn.id.substring(15)));
}
}
事件，然后当点击向上（向下？）到达它时，它会查看点击源自哪里并查看是否（或者是祖先）它是我们关心的按钮之一。如果是，我们会采取行动。