Bootstrap打开Modal,关闭后滚动条隐藏的解决方案

时间:2024-03-03 12:50:25

  我们在项目中使用bootstrap的modal 功能打开一个模态框(带滚动条),在modal上回继续打开模态框,在关闭第二个模态框的时候会造成第一个模态框滚动条消失,无法看到下面内容。 Html页面如下图所示

   

  造成滚动条消失的原因是因为modal关闭的时候清除modal-open样式,所以在关闭modal是调用它的隐藏事件,给body添加modal-open就可以解决,

  具体代码如下,在第二个modal关闭的时候,重新给body添加class 属性

       $("#com_Modal02").on("hidden.bs.modal", function () {

            $("#body").attr("class", "modal-open");

       });