Bootstrap - 模态框在隐藏时保持 "display: block"

Question

我的 Web 应用程序中有一个 bootstrap 模式，即使在我启动 myModal.modal('close'); 时它也会一直显示。我被那个奇怪的问题困住了。

大约。十分之一，我 display: block; 在收盘后留下来。模式已正确隐藏，因为我再也看不到它了，但它覆盖了我的整个页面，我无法点击任何东西。

我尝试用 :

处理关闭

$('#myModal').on('hidden.bs.modal', function () {
  $(this).css('display', 'none !important');
})

这不起作用，模态 div 仍然有 style="display: block;"

Answer 1

试试这些，如果有效请告诉我。

$('selector').css('z-index', '-999');
$('selector').css('margin-left', '-50000');
$('selector').css('margin-top', '-50000');

Answer 2

我的第一个问题是：您是否有自定义样式 sheet 可以覆盖 #myModal 的样式？如果是，请努力解决。

我的第二个问题是：您使用的 Bootstrap 是什么版本？我在 2012 年看到过类似的错误记录。如果可能，请升级到最新版本 Bootstrap (3.3.4)。

我的第三个问题是：您点击什么来关闭？它是关闭按钮（ type="button" class="close" ）还是带有 data-dismiss="modal" 属性的按钮？

如果关闭按钮，只要页面上没有其他模式，您就可以尝试这样做：

$(".close").on( "click", function() {
    $("#myModal").hide();
});

这也值得一试（尽管不是推荐的方法）：

$("#myModal").on("hide",function(){
    $("#myModal").css("display", "none");
});

最终，我同意需要像 Amit 和 Yerko 所建议的演示，因为这看起来很奇怪。我从来没有运行遇到过这样的事情，而且我已经使用了很长时间bootstrap。

Bootstrap - Modal keeps "display: block" when hidden