Comment empêcher un bouton externe de soumettre un formulaire en HTML ?

Comment empêcher un bouton HTML de soumettre un formulaire

Dans le développement Web, placer un bouton en dehors d'un formulaire vous permet généralement d'exécuter du JavaScript ou d'autres actions personnalisées en cliquant. Cependant, dans certains cas, ces boutons externes peuvent involontairement soumettre le formulaire à proximité duquel ils sont placés. Cela peut être frustrant lorsque vous souhaitez que le bouton remplisse une fonction distincte.

Considérez le scénario suivant :

<code class="html"><form id="myform">
    <label>Label <input /></label>
</form>
<button>My Button</button></code>

Lorsque vous cliquez sur l'élément « Mon bouton », vous pouvez vous attendre à ce qu'il déclencher JavaScript. Cependant, il soumet le myform de manière inattendue.

Pour résoudre ce problème, le code HTML du bouton doit être modifié pour l'empêcher de soumettre le formulaire :

<code class="html"><button type="button">My Button</button></code>

Ajout de l'attribut type avec une valeur de "bouton" précise explicitement que le bouton n'est pas destiné à soumettre le formulaire, désactivant ainsi sa fonctionnalité de soumission.

Mise à jour (5 février 2019) :

Selon Conformément au HTML Living Standard et à la spécification HTML 5, l'absence d'un attribut de type ou une valeur non valide pour l'attribut de type entraîne le bouton par défaut sur l'état du bouton de soumission.

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!