我有一个JQuery Fiddle正常运行。它使用JQUERY Steps PlugIn。现在，如果您在最后一步运行JQuery FIddle，您会发现三个按钮“保存”、“上一步”和“完成”。如果我点击Save button我想显示一个警告说“你已被点击”。如果您滚动到 JSFiddle 中 HTML 部分的底部，您将找到以下代码。
代码工作正常：
// on Save button click
$(".actions").on("click",".saveBtn",function(){
alert("You have been clicked!");
});
});
代码不起作用：
$( ".saveBtn" ).click(function() {
alert("You have been clicked");
});
问题：为什么第二个代码片段不起作用？
由于您的带有类的按钮.saveBtn是动态创建的，因此它不会在文档加载时进行初始化。但是为了将事件绑定到元素，它们通常需要在启动时进行初始化。但是，当所有事件都已经绑定到元素时，您的按钮就会被创建。所以你需要做一些叫做事件委托的事情。例如，这意味着您在整个文档中收听特定事件。当事件触发时，您会查找哪个元素触发了该事件。这样甚至可以选择动态创建的元素。一种常见的方法如下：
$(document).on('click', '.saveBtn', function(){
alert("Dynamic button clicked. Hurray!");
});
通过这种方式，您告诉整个document注册click事件并将事件源与您的选择器进行比较，在本例中为.saveBtn。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句