Comment empêcher les soumissions de formulaires doubles dans jQuery sans désactiver les éléments de formulaire ?

Empêcher les doubles soumissions dans les formulaires à l'aide de jQuery

Les utilisateurs soumettent souvent à nouveau des formulaires accidentellement, en particulier lorsqu'ils prennent beaucoup de temps à traiter. Pour éviter cela, jQuery peut être utilisé pour désactiver les soumissions de formulaires après la première tentative. Cependant, dans certains cas, la désactivation de tous les éléments du formulaire, y compris les entrées, peut involontairement empêcher la soumission elle-même.

Solution améliorée à l'aide du plugin jQuery

Une approche alternative consiste à utiliser un plugin jQuery pour gérer la prévention des doubles soumissions. Ce plugin exploite la méthode data() de jQuery pour marquer les formulaires comme soumis ou non.

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

    if ($form.data('submitted') === true) {
      // Previously submitted - don't submit again
      e.preventDefault();
    } else {
      // Mark it so that the next submit can be ignored
      $form.data('submitted', true);
    }
  });

  // Keep chainability
  return this;
};

Utilisation

Pour utiliser ce plugin, incluez-le simplement avec $(' form').preventDoubleSubmission();.

Exclure les AJAX autorisés Formulaires

Si certains formulaires (par exemple, les formulaires AJAX) doivent être autorisés à être soumis plusieurs fois, ils peuvent être exclus à l'aide de classes CSS, comme le montre l'exemple suivant :

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

Avec cette méthode, les formulaires peuvent être soumis sans aucun problème, tandis que les resoumissions accidentelles sont efficacement évitées, améliorant ainsi l'expérience utilisateur et évitant toute perte potentielle de données.

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!