Bootstrap中點(diǎn)擊按鈕后變灰并顯示加載中實(shí)例代碼
Bootstrap插件非常的好用了,我們今天一起來(lái)看一篇關(guān)于Bootstrap實(shí)現(xiàn)點(diǎn)擊按鈕之后按鈕變成不可點(diǎn)擊的一個(gè)效果了,具體的如下所示.
1.在按鈕中加入data-loading-text,即點(diǎn)擊按鈕后顯示的文字
<button type="submit" class="btn btn-primary btn-check" data-loading-text="提交中...">添加成員</button>
2.當(dāng)點(diǎn)擊按鈕后禁用按鈕,并顯示文字。如需綁定其他事件請(qǐng)自行更改。
第二三行為重要內(nèi)容。
$(".btn-check").click(function () {
$(this).button('loading');//禁用按鈕并顯示提交中
$(this).button('reset');//重置按鈕
});
3.設(shè)置disabled屬性為true即為不可用狀態(tài)。
document.getElementByIdx("btn").disabled=true;
jquery
$("#btn").attr("disabled", true);
html:
<input type="button" value="提交" id="btn">
以上所述是小編給大家介紹的Bootstrap中點(diǎn)擊按鈕后變灰并顯示加載中實(shí)例代碼,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
jquery表單驗(yàn)證實(shí)例仿Toast提示效果
這篇文章主要介紹了jquery驗(yàn)證表單仿Toast提示效果,實(shí)現(xiàn)代碼簡(jiǎn)單易懂,非常不錯(cuò),需要的朋友可以參考下2017-03-03
jquery點(diǎn)贊功能實(shí)現(xiàn)代碼 點(diǎn)個(gè)贊吧!
點(diǎn)贊功能很多地方都會(huì)出現(xiàn),如何實(shí)現(xiàn)愛(ài)心點(diǎn)贊功能,這篇文章主要為大家詳細(xì)介紹了jquery點(diǎn)贊功能實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05
jquery.simple.tree插件 更簡(jiǎn)單,兼容性更好的無(wú)限樹(shù)插件
在這里介紹一款小巧,功能強(qiáng)大,能拖拽,支持異步,且兼容性更高的jquery Tree插件2010-09-09
jquery+javascript編寫(xiě)國(guó)籍控件
本文給大家分享一個(gè)自己編寫(xiě)的使用jquery+javascript實(shí)現(xiàn)的國(guó)籍控件,效果非常不錯(cuò),這里推薦給大家。2015-02-02
jquery的ajaxSubmit()異步上傳圖片并保存表單數(shù)據(jù)演示代碼
使用jquery的ajaxSubmit()異步上傳圖片的捅死實(shí)現(xiàn)保存表單數(shù)據(jù),具體演示代碼如下,感興趣的朋友可以參考下哈,希望對(duì)大家有所幫助2013-06-06
jQuery實(shí)現(xiàn)限制文本框的輸入長(zhǎng)度
本文分享了jQuery實(shí)現(xiàn)限制文本框的輸入長(zhǎng)度的示例代碼,具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01
Jquery Ajax學(xué)習(xí)實(shí)例7 Ajax所有過(guò)程事件分析示例
JQuery在執(zhí)行Ajax的過(guò)程中會(huì)觸發(fā)很多事件。2010-03-03
jQuery事件綁定.on()簡(jiǎn)要概述及應(yīng)用
前幾天看到事件委托的時(shí)候,關(guān)于live()方法講的不是很詳細(xì),就去搜了一下關(guān)于live()和delegate()的,最后看源碼發(fā)現(xiàn)bind()和delegate()都是由on()實(shí)現(xiàn)的,感興趣的朋友可以了解下,或許本文對(duì)你有所幫助2013-02-02

