在提交按钮上设置延迟； ID。单击后按钮灰色并禁用 x 秒答案

【问题标题】：Set delay on submit button; i.d. button grey and disabled for x seconds after click在提交按钮上设置延迟； ID。单击后按钮灰色并禁用 x 秒
【发布时间】：2012-11-13 13:23:31
【问题描述】：

我喜欢在提交按钮上设置延迟。换句话说，单击该按钮后会变灰几秒钟。用js怎么实现呢？

【问题讨论】：

所以你想禁用按钮一段时间？

标签： javascript button submit delay

【解决方案1】：

这可能会对您有所帮助：http://jsfiddle.net/jhNcM/

<input type="button" id="aaa" value="button" />

$('#aaa').click(function() {
    var aaa =  $(this);
    aaa.prop('disabled', true);
    setTimeout(function() {
        aaa.prop('disabled', false);
    }, 3000);
});

【讨论】：

【解决方案2】：

纯 JavaScript：http://jsfiddle.net/R5p5q/1/

<form id="myForm">
    <input id="mySubmit" type="submit" value="GO" />
</form>

var myForm = document.getElementById('myForm');

myForm.addEventListener("submit", function(evt) {
    var elemSubmit = document.getElementById('mySubmit');
    elemSubmit.setAttribute("disabled", "disabled");

    // Removes disabling after 3 seconds
    window.setTimeout(function() {
        elemSubmit.removeAttribute("disabled");
    }, 3e3);
},false);

【讨论】：

【解决方案3】：

有办法做到这一点http://jsfiddle.net/Ktk6f/

HTML

<input type="submit" value="submitData" id="myButton" />

$('#myButton').click(function(){
    var that = $(this);
    that.attr('disabled', true);
    var timer = setTimeout(function(){
        that.attr('disabled', false);
    }, 1000);
});

需要 jQuery JS 框架

【讨论】：

@Kessi: 最好用 prop 代替 attr: stackoverflow.com/questions/5874652/prop-vs-attr

【解决方案4】：

$("#button").click(function() {
    if (this.disabled) {
        return;
    }
    this.disabled = true;
    setTimeout($.proxy(function() {
        this.disabled = false;
    }, this), 3000);
});

【讨论】：

如果你已经使用 jQuery（用于代理），为什么不使用 $().prop() 方法？？
@Naor 因为它更短且不使用字符串：this.disabled = true vs $(this).prop( "disabled", true )