Maison > interface Web > js tutoriel > Comment puis-je empêcher les boutons HTML de soumettre des formulaires de manière inattendue ?

Comment puis-je empêcher les boutons HTML de soumettre des formulaires de manière inattendue ?

Mary-Kate Olsen
Libérer: 2024-12-25 15:12:10
original
651 Les gens l'ont consulté

How Can I Prevent HTML Buttons from Unexpectedly Submitting Forms?

Empêcher les soumissions de formulaires de boutons

Dans certains scénarios, vous pouvez rencontrer une situation dans laquelle un bouton, tel que celui intitulé « supprimer », de manière inattendue soumet un formulaire. Pour résoudre ce problème, explorons la cause sous-jacente et une solution.

Comme mentionné dans le code fourni, les boutons HTML5 ont un comportement par défaut consistant à soumettre le formulaire conteneur. Ce comportement est défini dans la spécification du bouton HTML5 du W3C. Pour remplacer cette valeur par défaut et empêcher le bouton de soumettre le formulaire, vous devez spécifier explicitement son type à l'aide de l'attribut "type".

Dans le code modifié ci-dessous, le bouton "supprimer" a son type défini sur "bouton ":

<button type="button" onclick="removeItem(); return false;">Remove Last Item</button>
Copier après la connexion

En spécifiant le type "bouton", le bouton conservera sa fonctionnalité sans déclencher la soumission du formulaire.

Alternativement, vous pouvez utiliser un élément alternatif tel qu'un ou une balise élément avec un gestionnaire d'événements de clic pour simuler le comportement du bouton sans hériter de l'action de soumission de formulaire par défaut.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal