當前位置:
首頁 >
bootstrap 模态窗口 多重/多个弹窗滚动条补丁
發布時間:2025/10/17
33
豆豆
生活随笔
收集整理的這篇文章主要介紹了
bootstrap 模态窗口 多重/多个弹窗滚动条补丁
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
由于bootstrap的模態窗口默認不支持多次彈出, 在關閉的時候會有滾動條消失的問題. 經過觀察和查看源碼, 發現在開啟和關閉的時候會在body上增加/減少一個"modal-open"的class,所以只要在關閉的時候判斷一下是否還有沒關閉的窗口, 如果還有未關閉的, 則重新給body加上"modal-open"即可.
以下是代碼:
//bootstrap 多重modal彈窗滾動條補丁. $('body').on('hide.bs.modal', 'div.modal[role]', function (e) {var len = $('div.modal[role]').length;if (len > 1) {setTimeout(function () {$("body").addClass("modal-open");}, 500);} });?這里處理的有點麻煩, 做了個延遲500ms, 是由于"hide.bs.modal"的觸發時機過早, 模態窗體自帶的"hidden.bs.modal"無法像上面代碼那樣觸發,(麻煩哪位路過的大神給指個路.). 在事件觸發之后才執行了removeClass("modal-open") . 關于這個, 大家可以去看下bootstrap.js里面的源碼.搜索 "modal-open"即可找到相關代碼.
?
?
?
?
?
?
?
?如果您覺得這篇博客對您產生了一些必要的幫助,? 歡迎您對我意思意思, 我將會覺得您非常夠意思!?
轉載于:https://www.cnblogs.com/adinet/p/11321063.html
總結
以上是生活随笔為你收集整理的bootstrap 模态窗口 多重/多个弹窗滚动条补丁的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: isNumeric isInteger
- 下一篇: 牛客多校第六场-H-Pair