bootstrap模态框没法弹出

Posted 2023-04-27

点击按钮之后模态框没有弹出到最顶层，但是已经弹出了。应该怎么把模态框弄到最顶层

在bootstrap模态框弹出后触发函数方法如下：
1、show.bs.modal show 方法调用之后立即触发该事件。如果是通过点击某个作为触发器的元素，则此元素可以通过事件的 relatedTarget 属性进行访问。
2、shown.bs.modal 此事件在模态框已经显示出来（并且同时在 CSS 过渡效果完成）之后被触发。如果是通过点击某个作为触发器的元素，则此元素可以通过事的 relatedTarget 属性进行访问。

4、hide.bs.modal hide 方法调用之后立即触发该事件。
5、hidden.bs.modal 此事件在模态框被隐藏（并且同时在 CSS 过渡效果完成）之后被触发。
6、loaded.bs.modal 从远端的数据源加载完数据之后触发该事件。 参考技术A 你写的不大对 没触发 触发是class 添加modal-open 的追答

.modal（"show"）方法显示 你写的不对

追问

没用

还是显示不出来

追答

你写错着呢

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">模态框（Modal）标题</h4>
            </div>
            <div class="modal-body">按下 ESC 按钮退出。</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">提交更改</button>
            </div>
        </div>
    </div>
</div>

追问

是不是因为panel的原因，我之前用模态框的时候就弹出了，但是使用panel之后就无法弹出了

bootstrap使用模态框当弹出两层的时候，遮罩层会把原有的透明度减少。

bootstrap使用模态框当弹出两层的时候，遮罩层会把原有的透明度减少，导致变得不透明了，还有如果要是弹出多个模态框的话，他的顺序会根据文件读取的顺序来显示层级关系，例如：两个模态框一个高度是400px,一个高度是200px，在编写html的时候把400px的modal放到200px的modal下面，当弹框的时候先弹出400px的之后再弹出200px的话，200px的模态框会被400px的模态框覆盖到下面导致看不见。有人解决过这个问题吗？

参考技术A 每个模态窗会生成一个class为"modal-backdrop"的遮罩。在模态窗第一次显示时为这个模态窗的
遮罩层
设置一个id。例如：
$modal.modal(show:
true,backdrop:
'static');
$('.modal-backdrop').each(function()

$(this).attr('id',
'id_'
+
Math.random());
);