Bootstrap中点击后禁用按钮的最佳方法

为了防止在Bootstrap中点击按钮多次提交，所以希望点击按钮后禁用按钮。

具体实现方法如下：

//禁用button

$('button').addClass('disabled'); // Disables visually

$('button').prop('disabled', true); // Disables visually + functionally

 

//禁用类型为button的input按钮

$('input[type=button]').addClass('disabled'); // Disables visually

$('input[type=button]').prop('disabled', true); // Disables visually + functionally

 

//禁用超链接

$('a').addClass('disabled'); // Disables visually

$('a').prop('disabled', true); // Does nothing

$('a').attr('disabled', 'disabled'); // Disables visually

将上面方法写入点击事件中即可，如：

$(".btn-check").click(function () {

            $('button').addClass('disabled'); // Disables visually

$('button').prop('disabled', true); // Disables visually + functionally

        });

js按钮点击后几秒内不可用

function timer(time) {

 var btn = $("#sendButton");

 btn.attr("disabled", true);  //按钮禁止点击

 btn.val(time <= 0 ? "发送动态密码" : ("" + (time) + "秒后可发送"));

 var hander = setInterval(function() {

  if (time <= 0) {

   clearInterval(hander); //清除倒计时

   btn.val("发送动态密码");

   btn.attr("disabled", false);

   return false;

  }else {

   btn.val("" + (time--) + "秒后可发送");

  }

 }, 1000);

}

//调用方法

timer(30);

以上是云栖社区小编为您精心准备的的内容，在云栖社区的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索链接 ， 事件 类型 bootstrap 禁用按钮、bootstrap 按钮点击后、bootstrap 按钮点击、js 按钮点击后禁用、按钮点击后禁用，以便于您获取更多的相关知识。