bootstrap 打開多層模態框的情況下,關閉任意一個模態框,都會導致其余模態框的滾動條消失。
監測html發現,當打開模態框時,會給 body 元素加一個 modal-open 的 class,而在 bootstrap.css 中,有這樣一條 css 規則:
.modal-open .modal {overflow-x:hidden; overflow-y:auto}
因為有 overflow-y:auto,所以模態框才可以滾動,而當關閉任何一個模態框時,body 元素的 css 規則 modal-open 會被移除掉,自然 overflow-y:auto 也就沒有了,所以模態框的滾動條就消失了。
解決方案是在模態框的 div 元素上加一條 style="overflow: auto",如下:
<div class="modal fade" ... style="overflow: auto">
這樣,模態框的滾動就不依賴 body 元素的 css 規則 modal-open 了。