Bootstrap中點(diǎn)擊按鈕后變灰并顯示加載中實(shí)例代碼
更新時(shí)間：2016年09月23日 11:50:54 投稿：mrr
Bootstrap插件非常的好用了，今天小編通過本教程給大家介紹Bootstrap中點(diǎn)擊按鈕后變灰并顯示加載中實(shí)例代碼，非常不錯(cuò)，感興趣的朋友一起看看吧
Bootstrap插件非常的好用了，我們今天一起來看一篇關(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)擊按鈕后禁用按鈕，并顯示文字。如需綁定其他事件請自行更改。
第二三行為重要內(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í)例代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
基于jQuery實(shí)現(xiàn)的雙11天貓拆紅包抽獎(jiǎng)效果
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)的雙11天貓拆紅包抽獎(jiǎng)效果，在即將到來的雙十二活動中大家也可以使用拆紅包抽獎(jiǎng)吸引消費(fèi)者，需要的朋友可以參考下2015-12-12
最近再做價(jià)值中國微博，從用戶體驗(yàn)的角度，將很多常用的window.alert或者window.confirm之類比較生硬死板冷不丁的提示改為彈出層的方式實(shí)現(xiàn)。2010-10-10
用jQuery技術(shù)實(shí)現(xiàn)Tab頁界面之二
這個(gè)tab頁是把數(shù)據(jù)全部取回來再顯示，所以沒有數(shù)據(jù)緩存的特點(diǎn)。但是因?yàn)閿?shù)據(jù)全部是顯示的html代碼，所以對搜索引擎是友好的，也許對seo有好處。2009-09-09
選中或取消radio在項(xiàng)目中也會經(jīng)常用到，下面是用jquery實(shí)現(xiàn)radio的選中或取消，感興趣的朋友可以參考下2013-09-09
jQuery實(shí)現(xiàn)折疊、展開的菜單組效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)折疊、展開的菜單組效果代碼,涉及jQuery針對頁面元素屬性動態(tài)操作的相關(guān)技巧,展開折疊效果平滑自然,需要的朋友可以參考下2015-09-09
jQuery實(shí)現(xiàn)圖片隨機(jī)切換、抽獎(jiǎng)功能(實(shí)例代碼)
本文通過實(shí)例代碼給大家介紹了jQuery實(shí)現(xiàn)圖片隨機(jī)切換、抽獎(jiǎng)功能，感興趣的朋友跟隨小編一起看看吧2019-10-10
Jquery實(shí)現(xiàn)自定義tooltip示例代碼
這篇文章主要介紹了Jquery實(shí)現(xiàn)自定義tooltip的方法,需要的朋友可以參考下2014-02-02
進(jìn)度條和Loading加載動畫在當(dāng)今的網(wǎng)頁功能中顯得越來越重要了，于是接下來為大家推薦幾款比較新穎進(jìn)度條插件,感興趣的你可以參考下希望可以幫助到你2013-03-03
jQuery is not defined 錯(cuò)誤原因與解決方法小結(jié)
今天在測試一個(gè)程序的時(shí)候，明顯已經(jīng)加載了jquery但總是提示jQuery is not defined，經(jīng)過多方測試終于發(fā)現(xiàn)了問題，這里簡單總結(jié)一下,需要的朋友可以參考下2017-03-03
這篇文章主要為大家詳細(xì)介紹了多種jQuery綁定事件的實(shí)現(xiàn)方式，分享了jQuery防止重復(fù)綁定事件的解決方法，感興趣的小伙伴們可以參考一下2016-06-06