送信およびキャンセルのオプションを備えた JavaScript フォーム送信確認ダイアログを実装するにはどうすればよいですか?

JavaScript フォーム送信: 送信およびキャンセルのオプションを備えた確認ダイアログ

インライン JavaScript 確認ダイアログの使用

オプションを備えたフォーム送信確認ダイアログを実装するには送信またはキャンセルするには、インライン JavaScript 確認ダイアログを使用できます。このダイアログには、ユーザーにフォーム送信の確認を求めるポップアップ メッセージが表示され、「OK」と「キャンセル」の 2 つのボタンが表示されます。

インライン JavaScript 確認ダイアログを使用するには、次のコードを HTML に追加します。 form:

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

検証と確認のための外部関数の使用

ユーザーに確認を求める前に追加の検証を実行する必要がある場合は、検証と確認の両方のために外部 JavaScript 関数を作成できます。確認。その方法は次のとおりです。

1. 検証を実行し、ブール値 (有効の場合は true、無効の場合は false) を返す JavaScript 関数を作成します。

<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);"></code>

確認ダイアログのカスタマイズ

メッセージとボタンを使用して、確認ダイアログのメッセージとボタンのラベルをカスタマイズできます。 verify() 関数のオプション。例:

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

以上が送信およびキャンセルのオプションを備えた JavaScript フォーム送信確認ダイアログを実装するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。