JavaScript フォーム送信の確認またはキャンセルのダイアログ ボックスを実装するにはどうすればよいですか?

JavaScript フォーム送信: 確認またはキャンセル ダイアログ ボックスの実装

ユーザー エクスペリエンスを向上させるために、多くの場合、事前に確認またはキャンセルのプロンプトを提供することが望ましいです。フォームを送信する。この記事では、JavaScript を使用してこのようなダイアログ ボックスを実装する方法について説明します。

問題ステートメント:

単純なフォームには、ボタンのクリック時に警告ダイアログが必要で、次の 2 つのオプションがあります。

• [OK] をクリックするとフォームが送信されます。
• [キャンセル] をクリックすると警告ボックスが閉じ、ユーザーはフォームを調整して再送信できます。

解決策:

インライン JavaScript 確認

確認ダイアログを表示する便利な方法は、インライン JavaScript を使用することです:

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

このコードは、onsubmit イベント ハンドラーをフォームに追加します。送信ボタンをクリックすると、ユーザーの選択を示すブール値を返すconfirm() プロンプトが実行されます。

検証と確認

検証が必要なフォームの場合

<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>

この例では、 validate() 関数が必要なフォーム検証を実行し、エラーが検出された場合は false を返します。フォームが有効な場合は true が返され、confirm() ダイアログが表示され、ユーザーは送信を続行するかキャンセルすることができます。

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

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