BootStrap中按钮点击后被禁用按钮的最佳实现方法
Bootstrap中点击后禁用按钮与js有什么区别呢要如何来实现呢,今天我们就一起来看一篇关于Bootstrap中点击后禁用按钮的最佳方法,具体的例子如下所示.
为了防止在Bootstrap中点击按钮多次提交,所以希望点击按钮后禁用按钮。
具体实现方法如下:
//禁用button
$('button').addClass('disabled');//Disablesvisually
$('button').prop('disabled',true);//Disablesvisually+functionally
//禁用类型为button的input按钮
$('input[type=button]').addClass('disabled');//Disablesvisually
$('input[type=button]').prop('disabled',true);//Disablesvisually+functionally
//禁用超链接
$('a').addClass('disabled');//Disablesvisually
$('a').prop('disabled',true);//Doesnothing
$('a').attr('disabled','disabled');//Disablesvisually
将上面方法写入点击事件中即可,如:
$(".btn-check").click(function(){
$('button').addClass('disabled');//Disablesvisually
$('button').prop('disabled',true);//Disablesvisually+functionally
});
js按钮点击后几秒内不可用:
functiontimer(time){
varbtn=$("#sendButton");
btn.attr("disabled",true);//按钮禁止点击
btn.val(time<=0?"发送动态密码":(""+(time)+"秒后可发送"));
varhander=setInterval(function(){
if(time<=0){
clearInterval(hander);//清除倒计时
btn.val("发送动态密码");
btn.attr("disabled",false);
returnfalse;
}else{
btn.val(""+(time--)+"秒后可发送");
}
},1000);
}
//调用方法
timer(30);
以上所述是小编给大家介绍的BootStrap中按钮点击后被禁用按钮的最佳实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!