如何在通过Ajax引入的元素上使用Jquery document.on()?

fre*_*ent 12 jquery jquery-mobile

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

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

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

但是当我尝试将侦听器设置为$(document)并委托给checkbox侦听器时,侦听器永远不会触发:

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

问题:
为通过Ajax加载的"动态"元素设置事件绑定的正确方法是什么$(document).on()?这对change事件不可能或为什么我遇到麻烦?

感谢帮助!

cod*_*iel 11

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

第二个例子表现得像.live()delegate()在很多方面.并将适用于以后添加的元素.

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