汇盛国际娱乐:BootStrap中按钮点击后被禁用按钮的

标签:新闻动态    日期:2018-02-05 10:30    录入:汇盛国际平台    浏览:

  

[bootstrap,禁用按钮,bootstrap,按钮点击后]BootStrap中按钮点击后被禁用按钮的最佳实现方法

  

Bootstrap中点击后禁用按钮与js有什么区别呢要如何来实现呢,今天我们就一起来看一篇关于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); 
  
  

  

★★★小编:汇盛国际注册 整理文章,欢迎大家转载 ★★★