Wie verhindert man, dass HTML-Schaltflächen Formulare senden?

So verhindern Sie das Senden von Formularen über Schaltflächen

Problem:
In bestimmten Szenarien, z. B. bei der Verwendung von HTML5 Wenn Sie Schaltflächenelemente zum Hinzufügen oder Entfernen von Elementen verwenden, muss unbedingt verhindert werden, dass die Schaltfläche „Entfernen“ die Formularübermittlung auslöst. Während die Schaltfläche „Hinzufügen“ das Formular nicht sendet, geschieht dies mit der Schaltfläche „Entfernen“. Dieses Problem erfordert eine Lösung, um die Formularübermittlung für die gewünschte Schaltfläche zu deaktivieren.

Lösung:

Das Standardverhalten von HTML5-Schaltflächenelementen besteht darin, das Formular zu übermitteln, in dem sie enthalten sind Um dieses Verhalten zu überschreiben, muss ein explizites Typattribut angegeben werden. Indem wir den Typ auf „Schaltfläche“ anstelle der Standardeinstellung „Senden“ festlegen, können wir verhindern, dass die Schaltfläche die Formularübermittlung auslöst.

Der korrigierte Codeausschnitt unten zeigt, wie diese Änderung erreicht wird:

<button type="button" onclick="removeItem(); return false;">Remove Last Item</button>

Erklärung:

Das „type“-Attribut in HTML-Elementen definiert den Typ der verwendeten Schaltfläche. Wenn Sie es auf „Schaltfläche“ setzen, wird deutlich, dass der Zweck der Schaltfläche darin besteht, eine JavaScript-Funktion ohne zusätzliche Formularaktionen auszuführen. Die „Rückgabe falsch;“ Die Anweisung verhindert außerdem das Absenden des Formulars, wenn auf die Schaltfläche geklickt wird.

Durch diese Änderung führt die Schaltfläche „Entfernen“ nicht mehr zum Absenden des Formulars, während die Schaltfläche „Hinzufügen“ weiterhin wie vorgesehen funktioniert, ohne das Formular abzusenden.

Das obige ist der detaillierte Inhalt vonWie verhindert man, dass HTML-Schaltflächen Formulare senden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!