Comment puis-je intercepter et empêcher les soumissions de formulaires à l'aide de JavaScript ?

Intercepter les soumissions de formulaires à des fins de prévention

Dans une situation où vous disposez d'un formulaire avec un bouton d'envoi existant qui ne peut pas être modifié, empêchant sa soumission peut être réalisé via JavaScript.

Pour intercepter l'événement de soumission et l'empêcher de se produire, les étapes suivantes peuvent être pris :

Attraper l'événement de soumission :

1. Localiser l'élément de formulaire :

   const form = document.querySelector('form');

2. Ajouter un écouteur d'événement au formulaire pour le « soumettre » event :

   form.addEventListener('submit', handleSubmit);

Empêcher la soumission :

Dans la fonction de gestionnaire d'événements ('handleSubmit' dans ce cas), vous pouvez empêcher l'action de soumission en :

1. Appel de PreventDefault() sur l'événement object :

   const handleSubmit = (e) => {
     e.preventDefault();
   };

2. De plus, pour les soumissions de formulaires AJAX, le renvoi de false empêche davantage l'action de formulaire par défaut :

   function handleSubmit(e) {
     e.preventDefault();
     // Insert your custom logic here
     return false;
   };

Remarque : Comme souligné dans la réponse fournie, si une erreur JavaScript se produit avant la déclaration return false, le formulaire sera toujours soumis. Pour résoudre ce problème, envisagez d'utiliser un bloc try...catch pour gérer toute erreur potentielle et vous assurer que le formulaire n'est pas soumis même dans de tels cas.

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!