<p>我有以下的表单代码和javascript代码如下所示。问题是当执行到<code>validateDialogForm()</code>时，如果满足某些条件，会显示一个jquery对话框。我确实能够看到对话框出现了几秒钟，但它不会停留在那里，表单仍然继续提交。我希望表单在一段时间内暂停，只有当用户点击<code>保存</code>按钮时才提交。我尝试在<code>validateDialogForm()</code>函数结束前加上<code>return false;</code>，以阻止表单提交，但当我点击对话框的保存按钮时，它不会继续提交表单，而是保持原样。我在这里做错了什么？以下代码的当前状态是，无论jquery对话框如何，表单都将继续提交。（为了声音起见，删除了很多不相关的代码）</p>
<p><br />></p>
$('#checklist_dialog').hide();
函数 validateDialogForm() {
$('#checklist_dialog').show();
var isConfirmed = false;
//步骤:1 检查是否选择了选项 B。
var 选定的值 = "";
var selected = $("input[type='radio'][name='sampleChoice']:checked");
if (selected.length > 0) {
selectedVal = selected.val();
console.log("所选选项为 " + selectedVal);
}
if (selectedVal === "choiceB") {
if ($("#choiceBstatus").val() === "true") {
//显示对话框
$('#checklist_dialog').dialog({
模态：真实，
最大宽度：600，
最大高度：500，
宽度：600，
高度：500，
覆盖：{
不透明度：0.7，
背景：“黑色”
},
纽扣： {
“保存”：函数（）{
$(this).dialog('关闭');
alert("在被点击的保存按钮内");
$("#choiceBstatus").val("假");
//已确认= true;
返回真；
},
“取消”：函数（）{
$(this).dialog('关闭');
Alert("在保存表单之前，您必须完成/保存清单！");
// 返回假；
}
}
});
/* e.preventDefault();
返回假； */
} // if($("#choiceBstatus").val() == true ){ 结束
if ($("#choiceBstatus").val() === "false") {
// 返回真；
}
} //if(selectedVal === "choiceB"){ 结束
//返回假；
/* if(已确认){
返回真；
}
别的 {
返回假；
}
*/
}</pre>
如评论中所提到的，当对话框显示时，您需要阻止表单提交，因为对话框不会阻塞UI。除非您停止它，否则它将继续提交。在您按下对话框中的按钮后，您可以真正提交表单。
现在的棘手之处在于，当您真正提交表单时，这也会再次触发
onsubmit函数！一个好的方法是设置一个标志。请参见下面的伪代码，它应该基本上做到了您想要的。<form id="orderForm" action="/mywebsite/order.htm" method="POST" onsubmit="return (validateOrderForm(this) && validateDialogForm(this))"> ...let real_form_submit = false; function validateDialogForm(theForm){ if(!real_form_submit) { $('#checklist_dialog').dialog({ ... buttons: { "SAVE": function() { $(this).dialog('close'); real_form_submit = true; theForm.submit() }, "CANCEL": function() { $(this).dialog('close'); } } }); } return real_form_submit; }