jquery – 多个模态对话框滚动条Bootstrap v.3.3.5不能正常工作

前端之家收集整理的这篇文章主要介绍了jquery – 多个模态对话框滚动条Bootstrap v.3.3.5不能正常工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我用bootstrap v.3.3.5创建了多个模态对话框.当我启动第一个模态对话框时,右边的滚动条工作正常但在我启动第二个模态对话框后关闭它,滚动条消失了.

在bootstrap v.3.0.0中没有任何问题,你可以在下面的demo中看到

modal dialog with bootstrap v.3.0.0

但是,在bootstrap v.3.3.5中存在问题

modal dialog with bootstrap v.3.3.5

解决方法

DEMO

由于某种原因,它正在从body中删除我的modal-open类,这个滚动条消失了.所以这里有一个巧妙的技巧来捕获.modal的close事件并检查是否有任何.modal打开,如果是,则将.modal-open类添加到body

$("#myModal2").on('hidden.bs.modal',function (event) {
  if ($('.modal:visible').length) //check if any modal is open
  {
    $('body').addClass('modal-open');//add class to body
  }
});

现在,如果你有多个模态相互嵌套,只需用$(“文档”)替换$(“#myModal2”)

UPDATE

最近我开始知道这可以用纯CSS完成,只需一行如下:

.modal{
   overflow:auto !important;
}

UPDATED DEMO

猜你在找的jQuery相关文章