Bootstrap modal 多彈窗之疊加關(guān)閉陰影遮罩問(wèn)題的解決方法
上篇我提到的‘多彈窗之疊加顯示不出彈窗問(wèn)題'
這里也會(huì)遇到一次性關(guān)閉所有modal引起陰影遮罩的問(wèn)題，也就是所有modal都關(guān)閉了，但是主頁(yè)面仍然被陰影遮罩.
這個(gè)問(wèn)題從哪來(lái)的，是因?yàn)閙odal疊加，我們點(diǎn)擊窗口之外的空白部分，一次性關(guān)閉所有model，但是modal自己生成的'.modal-backdrop'只關(guān)閉了一個(gè)，其余的依然存在， 導(dǎo)致陰影遮罩.
這里的解決辦法是
1.第一種禁用modal 點(diǎn)擊空白自動(dòng)關(guān)閉的功能。
tempModal.modal({
backdrop:"static"
})
也就是只能點(diǎn)擊關(guān)閉按鈕，一層一層關(guān)閉，避免發(fā)生多層關(guān)閉的問(wèn)題。
2.第二種在最外層的modal關(guān)閉時(shí)，手動(dòng)刪除所有遮罩
$（"#tempModal"）.bind('hide.bs.modal',function(){
$(".modal-backdrop").remove();
})
這里好處是，保留了點(diǎn)擊空白自動(dòng)關(guān)閉的功能
以上所述是小編給大家介紹的Bootstrap modal 多彈窗之疊加關(guān)閉陰影遮罩問(wèn)題，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
- Bootstrap modal 多彈窗之疊加引起的滾動(dòng)條遮罩陰影問(wèn)題
- Bootstrap modal 多彈窗之疊加顯示不出彈窗問(wèn)題的解決方案
- BootStrap modal模態(tài)彈窗使用小結(jié)
- Bootstrap編寫(xiě)一個(gè)在當(dāng)前網(wǎng)頁(yè)彈出可關(guān)閉的對(duì)話(huà)框 非彈窗
- BootStrap的彈出框(Popover)支持鼠標(biāo)移到彈出層上彈窗層不隱藏的原因及解決辦法
- bootstrap實(shí)現(xiàn)彈窗和拖動(dòng)效果
- 全面解析Bootstrap彈窗的實(shí)現(xiàn)方法
- weebox彈出窗口不居中顯示的解決方法
相關(guān)文章
js實(shí)現(xiàn)C#的StringBuilder效果完整實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)C#的StringBuilder效果,以完整實(shí)例形式分析總結(jié)了js實(shí)現(xiàn)C#的StringBuilder效果的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-12-12
PHP中使用微秒計(jì)算腳本執(zhí)行時(shí)間例子
這篇文章主要介紹了PHP中使用微秒計(jì)算腳本執(zhí)行時(shí)間例子,本文先是講解了microtime函數(shù)的一些知識(shí),然后給出了一個(gè)計(jì)算腳本運(yùn)行時(shí)間的類(lèi),需要的朋友可以參考下2014-11-11
下面小編就為大家分享一篇mui back 返回刷新頁(yè)面的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2017-12-12
JavaScript數(shù)組去重的方法總結(jié)【12種方法，號(hào)稱(chēng)史上最全】
這篇文章主要介紹了JavaScript數(shù)組去重的方法,結(jié)合實(shí)例形式較為詳細(xì)的總結(jié)分析了12種方法數(shù)組去重的方法,需要的朋友可以參考下2019-02-02
Three.js利用dat.GUI如何簡(jiǎn)化試驗(yàn)流程詳解
dat.gui可以方便地向場(chǎng)景中添加控制條，隨時(shí)調(diào)整參數(shù)。下面這篇文章主要給大家介紹了關(guān)于Three.js利用dat.GUI如何簡(jiǎn)化試驗(yàn)流程的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面來(lái)一起看看吧。2017-09-09
這篇文章主要介紹了JavaScript 聲明提升的相關(guān)資料，幫助大家更好的理解和學(xué)習(xí)JavaScript，感興趣的朋友可以了解下2020-09-09
Angularjs手動(dòng)解析表達(dá)式（$parse）
這篇文章主要介紹了Angularjs手動(dòng)解析表達(dá)式（$parse）的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-10-10
JS實(shí)現(xiàn)可縮放、拖動(dòng)、關(guān)閉和最小化的浮動(dòng)窗口完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)可縮放、拖動(dòng)、關(guān)閉和最小化的浮動(dòng)窗口的方法,實(shí)例分析了javascript操作窗口層的技巧,需要的朋友可以參考下2015-03-03
javascript string字符串優(yōu)化問(wèn)題
今天看到一個(gè)很久的帖子說(shuō)string連接優(yōu)化問(wèn)題。于是自己也測(cè)試一下。寫(xiě)了個(gè)很簡(jiǎn)單的代碼2011-07-07
javascript 添加和移除函數(shù)的通用方法, 需要的朋友可以參考下。2009-10-10