Le bouton de l'interface utilisateur JQuery désactivé reste désactivé en retournant à la page

Question

J'ai un bouton de soumission JQuery UI sur un formulaire lorsque l'on clique dessus pour éviter de double-cliquer et de rendre également visiblement clair qu'il a bien été cliqué correctement.

J'utilise jQuery pour le faire:

$('input:submit').click(function() { 
    $(this).button('disable'); 
}); 

Il fonctionne, mais le problème est lorsque l'utilisateur frappe sur son bouton arrière, il reste désactivé. Quelle est la bonne façon de désactiver un bouton de soumission lorsque vous cliquez dessus? J'utilise évidemment jQuery, donc la préférence est d'utiliser jQuery.

MISE À JOUR: beaucoup de gens suggéré d'utiliser $(document).ready(function() {$('input:submit').button('enable');}); pour surmonter cette invalidante persistante du bouton. Il s'avère que cela ne fonctionnera pas s'il vient avant l'appel de mon initialisation de bouton $(function() {}. Mais si je mets ce bouton ('activer') après le code d'initialisation de mon bouton, même dans la section $(function() {}), cela fonctionne comme prévu.

Mais maintenant je me rends compte que tout ce bouton de désactivation ne fonctionne que dans Firefox! Si je désactive le bouton, le formulaire ne soumettra pas dans IE et Chrome (n'en ai pas testé d'autres)!

MISE À JOUR 2: Je suis enfin que cela fonctionne, mais un peu préoccupé par certains navigateurs ne vont pas être en mesure de présenter les choses avec ces solutions de contournement ... Voici mon code final, aimerait entendre des opinions de problèmes potentiels:

$(function() { 
    $('input:submit').button().click(function() { 
     $(this).button('disable'); 
     $(this).closest('form').submit(); 
     return false; 
    }); 
    $('input:submit').button('enable'); 
}); 

Answer 1

Ajoutez ceci à la page.

$(document).ready(function() { 
    $('input:submit').button({ disabled: false}); 
}); 

Answer 2

$(document).ready(function(){ 
$("input:submit").attr("disabled", ""); 
}) 

Answer 3

Eh bien, il va rester désactivé car le navigateur ne il est préférable d'enregistrer l'état de forme dans l'histoire. Donc, je recommande simplement de joindre à l'événement de chargement et de supprimer l'attribut désactivé.

Answer 4

Je ne trouve aucune référence à la méthode button dans la documentation de l'API jQuery. Utilisez-vous un module quelconque? Retournez devrait remettre le formulaire à son état initial, donc j'imagine qu'il doit y avoir une certaine magie de session qui se passe avec la méthode button. Effectuez les opérations suivantes à la place:

$('input:submit').click(function() { 
    $(this).attr('disabled', 'disabled'); 
}); 

Answer 5

Comme d'autres l'ont mentionné, les formes conservent (certains de) leur état lorsque vous cliquez sur le bouton de retour, vous devez activer le bouton d'envoi lorsque la page est chargée (qui également se produire quand quelqu'un clique sur le bouton de retour).

Ajouter à votre page:

$(document).ready(function(){ 
    $("input:submit").button("enable"); 
}); 

Notez que cette solution utilise la méthode jQuery UIbutton.enable() qui est l'inverse de la méthode button.disable() que vous avez utilisé.