jquery desactivar un botón por un tiempo específico

Question

quiero desactivar un botón por un tiempo específico. ¿Cómo puedo hacer eso?

Answer 1

Desactive el botón y luego use setTimeout para ejecutar una función que habilita el botón luego de unos segundos.

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

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

Answer 2

Dado que es probable que esto sea una tarea que le gustaría repetir, creo que la mejor manera de hacer esto sería extender jQuery así:

$.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); 
    }); 
}; 

Esto le permitirá llamar una función en un conjunto de elementos coincidentes que los desactivará temporalmente. Tal como está escrito, puede simplemente llamar a la función, y los elementos seleccionados se desactivarán durante 5 segundos. Se podría hacer eso, así:

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

Puede ajustar la configuración de tiempo predeterminado cambiando el 5000 en la siguiente línea:

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

se puede pasar opcionalmente en un valor de tiempo en milisegundos para controlar cómo Cuánto tiempo se deshabilitarán los elementos. Por ejemplo:

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

He aquí una demostración de trabajo: http://jsfiddle.net/fG2ES/

Answer 3

podría no ser la solución más elegante, pero pensé que jugaría con colas de jQuery en este ...

​$.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);​​​​ 
}); 

Aquí es donde trabajé hacia fuera ... http://jsfiddle.net/T9QJM/

Y, como referencia, How do I chain or queue custom functions using JQuery?

Answer 4

Pruebe esto.

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

se puede encontrar un ejemplo de trabajo aquí http://jsfiddle.net/informativejavascript/AMqb5/