Heim  >  Artikel  >  Web-Frontend  >  Wie kann ich einen Bestätigungsdialog für die Übermittlung eines JavaScript-Formulars mit Optionen zum Senden und Abbrechen implementieren?

Wie kann ich einen Bestätigungsdialog für die Übermittlung eines JavaScript-Formulars mit Optionen zum Senden und Abbrechen implementieren?

Patricia Arquette
Patricia ArquetteOriginal
2024-10-31 08:15:30613Durchsuche

How Can I Implement a JavaScript Form Submission Confirmation Dialog with Submit and Cancel Options?

JavaScript-Formularübermittlung: Bestätigungsdialog mit Übermittlungs- und Stornierungsoptionen

Verwenden eines Inline-JavaScript-Bestätigungsdialogs

So implementieren Sie einen Formularübermittlungsbestätigungsdialog mit Optionen Zum Absenden oder Abbrechen können Sie einen Inline-JavaScript-Bestätigungsdialog verwenden. In diesem Dialogfeld wird eine Popup-Meldung angezeigt, die den Benutzer auffordert, die Formularübermittlung zu bestätigen, und es stehen zwei Schaltflächen zur Verfügung: „OK“ und „Abbrechen“.

Um ein Inline-JavaScript-Bestätigungsdialogfeld zu verwenden, fügen Sie den folgenden Code zu Ihrem HTML hinzu Formular:

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

Verwenden einer externen Funktion zur Validierung und Bestätigung

Wenn Sie eine zusätzliche Validierung durchführen müssen, bevor Sie den Benutzer zur Bestätigung auffordern, können Sie eine externe JavaScript-Funktion sowohl für die Validierung als auch für die Bestätigung erstellen Bestätigung. So geht's:

  1. Erstellen Sie eine JavaScript-Funktion, die eine Validierung durchführt und einen booleschen Wert zurückgibt (wahr für gültig, falsch für ungültig).
<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>
  1. Fügen Sie die Funktion zum onsubmit-Ereignishandler Ihres HTML-Formulars hinzu.
<code class="html"><form onsubmit="return validate(this);"></code>

Anpassen des Bestätigungsdialogs

Sie können die Nachrichten- und Schaltflächenbeschriftungen des Bestätigungsdialogs mithilfe der Nachricht und Schaltflächen anpassen Optionen in der Funktion secure(). Zum Beispiel:

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

Das obige ist der detaillierte Inhalt vonWie kann ich einen Bestätigungsdialog für die Übermittlung eines JavaScript-Formulars mit Optionen zum Senden und Abbrechen implementieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn