快捷導(dǎo)航

BootStrap中按鈕點擊后被禁用按鈕的最佳實現(xiàn)方法

更新時間：2016年09月23日 11:43:29 投稿：mrr

在項目開發(fā)中經(jīng)常會遇到這樣的功能，為了防止在Bootstrap中點擊按鈕多次提交，所以希望點擊按鈕后禁用按鈕。怎么實現(xiàn)此功能呢？今天腳本之家小編給大家分享BootStrap中按鈕點擊后被禁用按鈕的最佳實現(xiàn)方法，非常不錯，感興趣的朋友參考下吧

Bootstrap中點擊后禁用按鈕與js有什么區(qū)別呢要如何來實現(xiàn)呢，今天我們就一起來看一篇關(guān)于Bootstrap中點擊后禁用按鈕的最佳方法，具體的例子如下所示．

為了防止在Bootstrap中點擊按鈕多次提交，所以希望點擊按鈕后禁用按鈕。

具體實現(xiàn)方法如下:

//禁用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按鈕點擊后幾秒內(nèi)不可用:
function timer(time) { 
var btn = $("#sendButton"); 
btn.attr("disabled", true); //按鈕禁止點擊 
btn.val(time <= 0 ? "發(fā)送動態(tài)密碼" : ("" + (time) + "秒后可發(fā)送")); 
var hander = setInterval(function() { 
if (time <= 0) { 
clearInterval(hander); //清除倒計時 
btn.val("發(fā)送動態(tài)密碼"); 
btn.attr("disabled", false); 
return false; 
}else { 
btn.val("" + (time--) + "秒后可發(fā)送"); 
} 
}, 1000); 
} 
//調(diào)用方法 
timer(30);

以上所述是小編給大家介紹的BootStrap中按鈕點擊后被禁用按鈕的最佳實現(xiàn)方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章: