Comment empêcher les formulaires de double soumission dans jQuery avec un plugin ?

Comment empêcher la double soumission d'un formulaire dans jQuery avec un plugin

Empêcher la resoumission d'un formulaire est crucial lorsque le traitement prend du temps côté serveur. Malheureusement, la désactivation de toutes les entrées de formulaire, comme vous l'avez tenté avec jQuery, peut empêcher la soumission du formulaire dans certains navigateurs.

Méthode recommandée : plug-in jQuery

Pour éviter efficacement la double soumission, nous recommandons un jQuery personnalisé plugin :

jQuery.fn.preventDoubleSubmission = function() {
  $(this).on('submit',function(e){
    var $form = $(this);

    if ($form.data('submitted') === true) {
      e.preventDefault();
    } else {
      $form.data('submitted', true);
    }
  });

  return this;
};

Utilisation :

Implémentez le plugin en sélectionnant le formulaire et en appelant PreventDoubleSubmission() :

$('form').preventDoubleSubmission();

Personnalisation :

Si certains formulaires doivent permettre plusieurs soumissions par chargement de page, attribuez-leur une classe et excluez-les du sélecteur :

$('form:not(.js-allow-double-submission)').preventDoubleSubmission();

Considérations supplémentaires :

• Comme mentionné dans la réponse originale, garantir que les opérations sont idempotentes est une solution optimale.
• Ce plugin s'appuie sur la méthode data() de jQuery, qui peut ne pas être prise en charge par les anciens navigateurs. Pensez à la compatibilité entre navigateurs avant la mise en œuvre.

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!