Désactivation d'un bouton pendant un certain temps

Question

Je souhaite désactiver un bouton pour une durée spécifique. Comment puis je faire ça?

Answer 1

Désactivez le bouton, puis utilisez setTimeout pour exécuter une fonction qui active le bouton après quelques secondes.

$('#some-button').attr("disabled", "disabled"); 
setTimeout('enableButton()', 5000); 

function enableButton(){ 
    $('#some-button').removeAttr('disabled'); 
} 

Answer 2

Comme il est susceptible d'être une tâche que vous voudrez peut-être répéter, je pense que la meilleure façon de le faire serait d'étendre jQuery comme ceci:

$.fn.timedDisable = function(time) { 
    if (time == null) { time = 5000; } 
    return $(this).each(function() { 
     $(this).attr('disabled', 'disabled'); 
     var disabledElem = $(this); 
     setTimeout(function() { 
      disabledElem.removeAttr('disabled'); 
     }, time); 
    }); 
}; 

Cela vous permettra d'appeler une fonction sur un ensemble d'éléments correspondants qui les désactivera temporairement. Comme il est écrit, vous pouvez simplement appeler la fonction, et les éléments sélectionnés seront désactivés pendant 5 secondes. Vous faire comme ceci:

$('#some-button').timedDisable(); 

Vous pouvez régler le réglage de l'heure par défaut en modifiant la 5000 dans la ligne suivante:

if (time == null) { time = 5000; } 

Vous pouvez éventuellement passer une valeur de temps en millisecondes pour contrôler la longtemps les éléments seront désactivés pour. Par exemple:

$('#some-button').timedDisable(1000); 

Voici une démonstration de travail: http://jsfiddle.net/fG2ES/

Answer 3

peut-être pas la solution la plus élégante, mais je pensais que je jouerais avec les files d'attente jQuery sur celui-ci ...

​$.fn.disableFor = function (time) { 
    var el = this, qname = 'disqueue'; 
    el.queue(qname, function() { 
     el.attr('disabled', 'disabled'); 
     setTimeout(function() { 
      el.dequeue(qname); 
     }, time || 3000); 
    }) 
    .queue(qname, function() { 
     el.removeAttr('disabled'); 
    }) 
    .dequeue(qname); 
}; 

$('#btn').click(function() { 
    ​$(this).disableFor(2000);​​​​ 
}); 

C'est là que je travaillais dehors ... http://jsfiddle.net/T9QJM/

Et, pour référence, How do I chain or queue custom functions using JQuery?

Answer 4

Essayez ceci.

(function(){ 
$('button').on('click',function(){ 
var $this=$(this); 
     $this 
      .attr('disabled','disabled'); 
      setTimeout(function() { 
      $this.removeAttr('disabled'); 
      }, 3000); 
     }); 
})(); 

Vous pouvez trouver un exemple de travail ici http://jsfiddle.net/informativejavascript/AMqb5/