如何實現帶有提交和取消選項的 JavaScript 表單提交確認對話框？

JavaScript 表單提交：帶有提交和取消選項的確認對話框

使用內聯JavaScript 確認對話框

實現帶有選項的表單提交確認對話方塊要提交或取消，您可以使用內嵌JavaScript 確認對話方塊。此對話方塊顯示一則彈出訊息，提示使用者確認表單提交，並提供兩個按鈕：「確定」和「取消」。

要使用內聯JavaScript 確認對話框，請將以下程式碼新增至HTML form:

<code class="html"><form onsubmit="return confirm('Do you really want to submit the form?');"></form></code>

使用外部函數進行驗證並確認

如果您需要在提示使用者確認先前執行額外的驗證，您可以建立一個外部JavaScript 函數來進行驗證和確認確認。操作方法如下：

1. 建立一個執行驗證並傳回布林值的 JavaScript 函數（true 表示有效，false 表示無效）。

<code class="javascript">function validate(form) {

    // Validation code here ...

    if (!valid) {
        alert('Please correct the errors in the form!');
        return false;
    }
    else {
        return confirm('Do you really want to submit the form?');
    }
}</code>

2. 將此函數加入 HTML 表單的 onsubmit 事件處理程序中。

<code class="html"><form onsubmit="return validate(this);"></form></code>

自訂確認對話方塊

您可以使用訊息和按鈕自訂確認對話方塊的訊息和按鈕標籤確認（）函數中的選項。例如：

<code class="javascript">confirm({
  message: 'Are you sure you want to continue?',
  buttons: ['Yes', 'No', 'Cancel']
});</code>

以上是如何實現帶有提交和取消選項的 JavaScript 表單提交確認對話框？的詳細內容。更多資訊請關注PHP中文網其他相關文章！