javascript - 在 jQuery 中将 live() 变成 on()

Question

我的应用程序已动态添加下拉菜单。用户可以根据需要添加任意数量。

我传统上使用 jQuery 的 live() 方法来检测这些下拉列表之一何时被 change()ed:

$('select[name^="income_type_"]').live('change', function() {
    alert($(this).val());
});

从 jQuery 1.7 开始，我已将其更新为:

$('select[name^="income_type_"]').on('change', function() {
    alert($(this).val());
});

查看文档，这应该是完全有效的(对吗？) - 但事件处理程序永远不会触发。当然，我已经确认 jQuery 1.7 已加载并运行等。错误日志中没有错误。

我做错了什么？谢谢!

Answer 1

on documentation状态(粗体；)):

Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on().

等价于 .live() 会类似于

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

虽然最好将事件处理程序绑定(bind)到尽可能靠近元素的位置，也就是说，绑定(bind)到层次结构中更靠近的元素。

更新:在回答另一个问题时，我发现 .live documentation 中也提到了这一点。 :

Rewriting the .live() method in terms of its successors is straightforward; these are templates for equivalent calls for all three event attachment methods:

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+