如何在通过Ajax引入的元素上使用Jquery document.on（）？

Question

我有一个Jquery Mobile shell页面，我正在使用Ajax加载表单。表单有一些复选框，我需要绑定到它。

奇怪的是，我可以让它直接在按钮上设置监听器，如下所示：

$('input[name="ohneiln"]').on('change', function() {
   alert("hello");
   });

但是当我试图将监听器设置为$(document)并委托给checkbox时，监听器永远不会触发：

$(document).on('change', 'input[name="ohneiln"]', function() {
   alert("hello");
});

问题：
使用$(document).on()通过Ajax加载“动态”元素设置事件绑定的正确方法是什么？这对于change事件是不可能的，还是为什么我遇到了麻烦？

感谢您的帮助！

Answer 1

.on()方法的工作方式根据您的使用方式而变化。在您的第一个示例中，.on()方法的行为类似于bind，并且仅适用于已存在的元素。

第二个示例在很多方面表现得像.live()或delegate()。并且适用于稍后添加的元素。

阅读文档以获取详细解释http://api.jquery.com/on/