javascript - jQuery 应用事件处理程序的最佳方式

Question

我正在处理一个包含 20 列和 100 多行的网格。每列都有一个输入字段。现在我想将事件处理程序放在输入字段上，例如 change 和 keyup、focus 等等。所以可以有 20*100 个事件 = 2000!

最好的方法是什么？我读过一些关于 eventHandlers 和内存问题的文章。

我认为我应该这样做:

$("#grid input").each(function() {
    $(this).keyup(function() {
        // 
    });
    $(this).change(function() {
        // 
    });
});

或者这是最好的方法吗？

$("#grid").keyup(function() {
        // 
});

Answer 1

您正在寻找事件委托(delegate)。

$("#grid").on("change", "input", function() {
    // Handle the event here, `this` refers to the input where it occurred
});

附加一个 处理程序(在#grid 上)，仅当事件通过与第二个选择器匹配的元素时，jQuery 才会触发该处理程序。它调用处理程序，就像处理程序附加到实际的 input 一样。 jQuery 的机制甚至支持像 focus 这样原生不冒泡的事件。

更多信息 the on documentation .