如何在 JavaScript 中对事件处理程序进行早期绑定？ （以 jQuery 为例）

JavaScript 的后期绑定很棒。但是当我想要的时候如何尽早绑定呢？

我正在使用 jQuery 将循环中的事件处理程序链接添加到 div 中。变量“aTag”在循环中发生变化。当我稍后单击链接时，所有链接都会发出相同的警报消息，即“aTag”的最后一个值。如何为所有链接绑定不同的警报消息？

所有链接都应在添加事件处理程序时（而不是单击事件处理程序时）发出“aTag”值的警报。

for (aTag in tagList) {
  if (tagList.hasOwnProperty(aTag)) {
    nextTag = $('<a href="#"></a>');
    nextTag.text(aTag);
    nextTag.click(function() { alert(aTag); });
    $('#mydiv').append(nextTag);
    $('#mydiv').append(' ');
  }
}

您可以将数据传递给bind method:

nextTag.bind('click', {aTag: aTag}, function(event) {
    alert(event.data.aTag);
});

这将复制aTag，因此每个事件处理程序都会有不同的值。您的用例正是此参数的原因bind exists.

完整代码：

for (aTag in tagList) {
  if (tagList.hasOwnProperty(aTag)) {
    nextTag = $('<a href="#"></a>');
    nextTag.text(aTag);
    nextTag.bind('click', {aTag: aTag}, function(event) {
      alert(event.data.aTag);
    });
    $('#mydiv').append(nextTag);
    $('#mydiv').append(' ');
  }
}