Intercepter une soumission de formulaire en JavaScript et empêcher la soumission normale

Question

Il semble y avoir beaucoup d'informations sur la façon de soumettre un formulaire en utilisant JavaScript, mais je cherche une solution pour capturer quand un formulaire a été soumis et l'intercepter en JavaScript.

HTML

 Go

Quand un utilisateur appuie sur le bouton de soumission, je ne veux pas que le formulaire soit soumis, mais je voudrais qu'une fonction JavaScript soit appelée.

function captureForm() {
 // faire quelque chose avec les valeurs dans le formulaire
 // arrêter la soumission du formulaire
}

Une astuce rapide serait d'ajouter une fonction onclick au bouton mais je n'aime pas cette solution... il existe de nombreuses façons de soumettre un formulaire... par exemple en appuyant sur la touche Entrée lorsque l'on est sur un champ de saisie, ce qui n'est pas pris en compte.

Merci

Answer 1

Une alternative à l'utilisation de addEventListener et event.preventDefault est de modifier la soumission du formulaire. Cette méthode semble plus robuste, surtout si le formulaire a d'autres écouteurs d'événements attachés.

Nous pouvons mettre à jour la soumission du formulaire en utilisant le code suivant :

form.originSubmit = form.submit
form.submit = function () {
  submitHandlerAsync(form)
  return false
}

Voir plus de détails dans l'article : https://runkiss.blogspot.com/2021/05/intercept-html-forms-submit.html