我們如何檢查在jQuery UI對話框中單擊了哪個按鈕？

Question

我正在嘗試使用jQuery UI構建一個對話框，並且是/否按鈕以供用戶確認。 （這是因爲我想使用戶界面統一，因爲我使用jQuery UI來構建警告對話框。）我的意圖是要求用戶確認是否在文本框中提交了大量（1000或更高）。到目前爲止，我的JavaScript代碼如下所示：

function checkclick(button1, button2, theForm) { 
    var val; 
    val = theForm.mybox.value; 
    v = parseInt(val) || 0; 
    var btns = {}; 
    btns[button1] = function(){ 
     $(this).dialog('close'); 
    }; 
    btns[button2] = function(){ 
     $(this).dialog('close'); 
    }; 

    if (v >= 1000) { 
     $('#dialog').dialog({ 
     autoOpen: true, 
     modal:true, 
     buttons:btns 
     }); 
     $('#dialog_link').click(function() { 
      $('#dialog').dialog('open'); 
     }); 
     return false; 
    } 
    return true; 
} 

我的HTML看起來像這樣：

<div id='dialog' title='Note' style='display:none'> 
<p id='dialog_link'>This is a very large number. Are you sure?</p> 
</div> 

<form name='myForm' action='result.php' method='post' 
onsubmit="return checkclick('Yes', 'No', this)"> 
<input type='text' name='mybox'> 
<input type='submit'> 
</form> 

的問題是，當用戶點擊是或否按鈕，它會回去到同一頁面。但是，如果我在'if'部分中將'return false'更改爲'return true'，則單擊Submit按鈕後，頁面將直接轉到result.php，而不必等待用戶單擊Yes或No按鈕。有沒有什麼方法可以檢查用戶點擊哪個按鈕，這樣在點擊Yes之後，頁面會轉到result.php，點擊No後仍然保留在當前頁面上？

Answer 1

jQuery對話框有選項buttons它可以用來描述所需的按鈕和它的動作。

function checkclick(button1, button2, theForm) { 
    var val; 
    val = theForm.mybox.value; 
    v = parseInt(val) || 0; 

    if (v >= 1000) { 
     $('#dialog').dialog({ 
     autoOpen: true, 
     modal:true, 
     buttons:{ 
      "Yes":function() { 
       alert('Yes has been clicked'); //Your coding here 
      }, 
      "No": function() { 
       $(this).dialog("close"); 
      } 
     } 
     }); 
     $('#dialog_link').click(function() { 
      $('#dialog').dialog('open'); 
     }); 
     return false; 
    } 
    return true; 
} 

Answer 2

我沒有「聲譽」來評論你的後續行動，所以我不得不作爲答覆發佈。在協議中違反道歉。

如果我正確理解你的目標，你只需要有條件地提交表格。我相信，如果用戶決定表單提交時間過長，則可以通過防止默認行爲來實現此目的。事情是這樣的：

<form id="target" action="destination.html"> 
    <input type="text" value="string value"> 
    <input type="submit" value="Submit"> 
</form> 

$("#target").submit(function(event) { 
    if (//result of dialog is false) { 
    event.preventDefault(); 
    } else { 
    return; 
    } 
});