JavaScript-Übermittlung von Formularen verhindern

Kushank Singh 12 Oktober 2023
  1. Verwenden Sie eine Funktion innerhalb des script-Tags, um die Ausführung eines Formulars in JavaScript zu stoppen
  2. Verwenden Sie das Vanilla-JavaScript, um die Ausführung des Formulars in JavaScript zu stoppen
  3. Verwenden Sie die Bibliothek jQuery, um die Ausführung des Formulars in JavaScript zu stoppen
  4. Verwenden Sie das Dojo-Toolkit, um die Ausführung des Formulars in JavaScript zu stoppen
JavaScript-Übermittlung von Formularen verhindern

JavaScript wird von allen Webbrowsern unterstützt und wird verwendet, um dynamische Webseiten zu erstellen. In diesem Tutorial stoppen wir die Ausführung eines Formulars mit JavaScript.

Verwenden Sie eine Funktion innerhalb des script-Tags, um die Ausführung eines Formulars in JavaScript zu stoppen

Das Tag script wird verwendet, um ein clientseitiges Skript zu enthalten. Wir haben innerhalb der script-Tags eine JavaScript-Funktion geschaffen, die das Absenden des Formulars verhindert.

Überprüfen Sie den Code unten.

<form onsubmit="submitForm(event)">
  <input type="text">
  <button type="submit">Submit</button>
</form>
<script type="text/JavaScript">
  function submitForm(event){
    event.preventDefault();
    window.history.back();
  }
</script>

Die Funktion preventDefault() lässt die Standardaktion des Ereignisses nicht stattfinden. Die window.history.back() führt uns zur vorherigen URL in unserer Historie. Alle besprochenen Methoden umfassen diese beiden Funktionen.

Verwenden Sie das Vanilla-JavaScript, um die Ausführung des Formulars in JavaScript zu stoppen

Vanilla JavaScript arbeitet rein auf JavaScript ohne die Verwendung zusätzlicher Bibliotheken.

Ein Ereignis-Listener kann verwendet werden, um das Senden von Formularen zu verhindern. Es wird der Senden-Schaltfläche hinzugefügt, die die Funktion ausführt und das Senden eines Formulars beim Klicken verhindert.

Beispielsweise,

element.addEventListener('submit', function(event) {
  event.preventDefault();
  window.history.back();
}, true);

Verwenden Sie die Bibliothek jQuery, um die Ausführung des Formulars in JavaScript zu stoppen

jQuery ist eine schnelle und robuste Bibliothek, die die Verwendung von JavaScript vereinfacht. Es ist eine der beliebtesten Bibliotheken von JavaScript.

Wir werden sehen, wie wir das Absenden des Formulars verhindern können.

Überprüfen Sie den Code unten.

$('#form').submit(function(event) {
  event.preventDefault();
  window.history.back();
});

Die Funktion $('#form').submit() wird verwendet, um ein Formular in jQuery zu senden.

Verwenden Sie das Dojo-Toolkit, um die Ausführung des Formulars in JavaScript zu stoppen

Es ist eine JavaScript-Bibliothek, die die plattformübergreifende Verwendung von JavaScript für webbasierte Anwendungen erleichtert. Es verwendet die Funktion dojo.connect(), um Ereignisse zu behandeln. In unserem Fall wird dies für die Formularübermittlung verwendet und wir verhindern dies mit den Funktionen preventDefault() und window.history.back().

Beispielsweise,

dojo.connect(form, 'submit', function(event) {
  event.preventDefault();
  window.history.back();
});

Verwandter Artikel - JavaScript Form