javascript - 无法阻止附加在 Jquery UI 对话框上的表单按钮的默认操作

Question

我正在通过 Ajax 将表单加载到 jquery 对话框窗口，但是当我在提交按钮上附加点击事件时，我无法阻止表单的默认提交，即。当用户单击附加表单提交按钮并且对话框不关闭时，我希望表单不提交。问题是，我无法使用 jquery 选择此按钮，但是当我在 firebug 中运行它并且对话框已经打开时脚本起作用。该表单是在类的 admin.php 中创建的注意:表单在对话框窗口中正确加载，所以 ajax 很好，但我无法选择并将点击事件附加到表单峰会按钮，我不想使用对话框按钮。我希望表单按预期运行。然后，如果表单在普通网页上但不在对话框中，我可以阻止提交按钮操作请协助我是编程新手这是 admin.php 中的代码，单击链接时通过 Jquery ajax 加载

<form action="process.php" method="post" id="edit_form">   
<input type="submit" name="event_submit" value="Create" />
<a href="./">cancel</a>
</fieldset>
</form>

我也无法阻止单击取消链接时的默认操作。这是加载 admin.php 的 jquery 代码

这是防止表单提交按钮的默认操作起作用的代码

$("#edit_form input[type=submit]").on("click",function(event){
        event.preventDefault();         
        alert('You clicked a button');  
    });

Answer 1

您需要使用事件委托(delegate)来确保按钮事件在由 jQuery UI 动态创建时被绑定(bind):

$(document).on("click","#edit_form input[type=submit]", function(event){
        event.preventDefault();         
        alert('You clicked a button');  
    });

查看 .on 的文档其中非常详细地解释了这个概念。