Comment empêcher un bouton de soumettre un formulaire dans Firefox ?

Empêcher la soumission de formulaire avec des boutons

Lorsque vous travaillez avec des formulaires, il est parfois nécessaire d'ajouter des boutons qui effectuent des actions spécifiques sans déclencher la soumission du formulaire. Dans cet article, nous aborderons la question de savoir comment empêcher un bouton spécifique, comme le bouton « supprimer » dans l'extrait de code fourni, de soumettre le formulaire dans Firefox tout en autorisant d'autres boutons à le faire.

Énoncé du problème

Dans le formulaire HTML donné, le bouton « ajouter » fonctionne correctement, tandis que le bouton « supprimer » soumet le formulaire après avoir cliqué. Ce comportement est spécifique à Firefox et résulte du comportement par défaut des éléments de bouton HTML5.

Comprendre le problème

Les éléments de bouton HTML5 héritent d'un type par défaut de « soumettre », selon les spécifications W3. . Cela signifie que, sauf indication contraire explicite, les boutons ont le comportement inhérent de soumettre le formulaire qui les contient.

Solution : remplacer le type par défaut

Pour empêcher le bouton « Supprimer » de soumettre le formulaire, il est nécessaire de remplacer son type par défaut. Ceci peut être réalisé en spécifiant explicitement le type comme « bouton » :

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

En définissant l'attribut type sur « bouton », nous demandons au bouton de se comporter comme un élément de bouton standard et de ne pas soumettre le formulaire. Cependant, nous devons également inclure une instruction return supplémentaire :

return false;

Cette instruction return empêche l'action par défaut du bouton (qui consiste à soumettre le formulaire) de se produire. La combinaison de ces deux éléments garantit que le bouton "supprimer" déclenche la fonction JavaScript souhaitée sans soumettre le formulaire.

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!