Désactiver l'envoi automatique du formulaire en cliquant sur le bouton

J'ai un formulaire HTML où j'utilise plusieurs boutons. Le problème est que quel que soit le bouton sur lequel je clique, le formulaire sera soumis même si le bouton n'est pas de type «soumettre». Par exemple, des boutons tels que:, <button>Click to do something</button>entraînent la soumission du formulaire.

C'est assez pénible de faire un e.preventDefault()pour chacun de ces boutons.

J'utilise jQuery et jQuery UI et le site Web est en HTML5.

Existe-t-il un moyen de désactiver ce comportement automatique?

Les boutons tels que <button>Click to do something</button> les boutons d'envoi.

Préparez-vous type="button"à changer cela. type="submit"est la valeur par défaut (comme spécifié par la recommandation HTML ).

Vous pouvez simplement essayer d'utiliser return false (return false remplace le comportement par défaut sur chaque élément DOM) comme ça:

myform.onsubmit = function ()
{ 
  // do what you want
  return false
}

puis soumettez votre formulaire en utilisant myform.submit ()

Ou bien :

mybutton.onclick = function () 
{
   // do what you want
   return false
}

De plus, si vous utilisez type="button"votre formulaire ne sera pas soumis.

<button>Les boutons de soumission sont en fait, ils n'ont pas d 'autres fonctionnalités principales. Vous devrez définir le type sur bouton.
Mais si vous liez votre gestionnaire d'événements comme ci-dessous, vous ciblez tous les boutons et n'avez pas à le faire manuellement pour chaque bouton!

$('form button').on("click",function(e){
    e.preventDefault();
});

si vous voulez ajouter directement à l'entrée comme attribut, utilisez ceci

 onclick="return false;" 

<input id = "btnPlay" type="button" onclick="return false;" value="play" /> 

cela empêchera le comportement de soumission de formulaire

un autre:

if(this.checkValidity() == false) {

                $(this).addClass('was-validated');
                e.preventDefault();
                e.stopPropagation();
                e.stopImmediatePropagation();

                return false;
}