$('#checklist_dialog').hide(); 函數(shù) 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({ 模態(tài):真實, 最大寬度:600, 最大高度:500, 寬度:600, 高度:500, 覆蓋:{ 不透明度:0.7, 背景:“黑色” }, 紐扣: { “保存”:函數(shù)(){ $(this).dialog('關閉'); alert("在被點擊的保存按鈕內(nèi)"); $("#choiceBstatus").val("假"); //已確認= true; 返回真; }, “取消”:函數(shù)(){ $(this).dialog('關閉'); Alert("在保存表單之前,您必須完成/保存清單!"); // 返回假; } } }); /* e.preventDefault(); 返回假; */ } // if($("#choiceBstatus").val() == true ){ 結束 if ($("#choiceBstatus").val() === "false") { // 返回真; } } //if(selectedVal === "choiceB"){ 結束 //返回假; /* if(已確認){ 返回真; } 別的 { 返回假; } */ }</pre>
如評論中所提到的,當對話框顯示時,您需要阻止表單提交,因為對話框不會阻塞UI。除非您停止它,否則它將繼續(xù)提交。在您按下對話框中的按鈕后,您可以真正提交表單。
現(xiàn)在的棘手之處在于,當您真正提交表單時,這也會再次觸發(fā)onsubmit
函數(shù)!一個好的方法是設置一個標志。請參見下面的偽代碼,它應該基本上做到了您想要的。
<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; }