jquery 引导模式弹出窗口未关闭

new9mtju 于 2022-11-22 发布在 jQuery

关注(0)|答案(7)|浏览(226)

我在使用引导模式弹出窗口时遇到问题。调用弹出窗口没有问题，但尝试关闭它会产生奇怪的结果。不是隐藏弹出窗口并删除背景，而是隐藏了弹出窗口但添加了另一个背景，使屏幕几乎变黑。原来的背景不会被删除。
下面是我尝试使用的html代码

<div id="popupDelete" class="modal hide fade" role="dialog">
    <div class="modal-header">delete transaction line?</div>
    <div class="moda-body">
        <button id="deleteYes">yes</button>
        <button class="cancelButton" data-dismiss="modal">no</button>
    </div>
</div>

这是我从bootstrap 2. 3文档中得到的，应该可以在teh bix中工作，就像bootstrap中的其他东西一样。
我也尝试过将javascript与$('#popupDelete').modal('hide');函数结合使用，效果相同。

jquery

来源：https://stackoverflow.com/questions/18464081/bootstrap-modal-popup-not-closing

7条答案

按热度按时间

ergxz8rk1#

确实有javascript与弹出窗口的关闭冲突。当点击父容器时，有一行javascript扰乱了所有的弹出窗口，迫使它们再次打开。

赞(0）回复(0）举报 2022-11-22

px9o7tmv2#

@dreagan ，它可能会发生一样，例如，当你点击打开按钮，弹出窗口是动态创建的，所以你可能需要关闭尝试这个：

$('#popupDelete').close()

中的每一个
或

$.modal.close();

格式
参考此 How do you close a jQuery Simplemodal?

赞(0）回复(0）举报 2022-11-22

lmyy7pcs3#

尽可能将模态HTML放在顶层位置，以避免其他元素的潜在干扰。当.modal嵌套在另一个固定元素中时，您可能会遇到问题。

赞(0）回复(0）举报 2022-11-22

qjp7pelc4#

动态创建模态的方法（ Bootstrap 5 ）：
HTML ：

...
<button type="button" class="close" data-dismiss="modal" aria-label="Close" onclick="close_modal();">
<span aria-hidden="true">&times;</span>
</button>
...

中的每一个
Javascript 语言：

var my_modal = new bootstrap.Modal(document.getElementById('my_modal'), {
    keyboard: false
})

// To open
function open_modal () {
    my_modal.open();
}

// To close
function close_modal ()
{
   my_modal.hide();
}

格式

赞(0）回复(0）举报 2022-11-22

63lcw9qa5#

检查您是否也添加了脚本。并尝试切换方法来隐藏模态。

赞(0）回复(0）举报 2022-11-22

ttvkxqim6#

这个对我很有效