我可以检查自举模式显示/隐藏？

小开

最佳答案

alert($('#myModal').hasClass('in'));

如果模态是打开的，它将返回 true

小开

最好的方法是在文档中给出的

$('#myModal').on('shown.bs.modal', function () {
// will only come inside after the modal is shown
});

更多信息请参考 http://getbootstrap.com/javascript/#modals

小开

什么时候模态隐藏? 我们像这样检查:

$('.yourmodal').on('hidden.bs.modal', function () {
// do something here
})

小开

这是一个老问题，但无论如何，这里我使用的东西，以防有人正在寻找同样的东西

if (!$('#myModal').is(':visible')) {
// if modal is not shown/visible then do something
}

小开

if($('.modal').hasClass('in')) {
alert($('.modal .in').attr('id')); //ID of the opened modal
} else {
alert("No pop-up opened");
}

小开

使用 hasClass('in')。如果模态处于 OPEN状态，它将返回 true。

例如:

if($('.modal').hasClass('in')){
//Do something here
}

小开

官方说法:

> ($("element").data('bs.modal') || {})._isShown    // Bootstrap 4
> ($("element").data('bs.modal') || {}).isShown     // Bootstrap <= 3

{}用于避免模态尚未打开的情况(它返回 undefined)。您也可以指定它等于 {isShown: false}，以保持它的更有意义。

小开

对我来说这很有用

If ($(“ # myModal”) . css (“ display”) ! = ‘ none’& & $(“ # myModal”) . css (“ visible”) ! = ‘ hide’)


警报(「显示模式」) ;

小开

使用 Bootstrap 4:

if ($('#myModal').hasClass('show')) {
alert("Modal is visible")
}

小开

所有 Bootstrap 版本:

var isShown = $('.modal').hasClass('in') || $('.modal').hasClass('show')

只要关闭它独立于状态和版本:

$('.modal button.close').click()

更多信息

引导3号及之前

var isShown = $('.modal').hasClass('in')

鞋带4

var isShown = $('.modal').hasClass('show')

小开

下面是一些自定义代码，它们给出了更明确地命名为类的模态状态:

$('.modal').on('show.bs.modal', function(e)
{
e.currentTarget.classList.add("modal-fading-in");
e.currentTarget.classList.remove("modal-fading-out");
e.currentTarget.classList.remove("modal-hidden");
e.currentTarget.classList.remove("modal-visible");
});


$('.modal').on('hide.bs.modal', function(e)
{
e.currentTarget.classList.add("modal-fading-out");
e.currentTarget.classList.remove("modal-fading-in");
e.currentTarget.classList.remove("modal-hidden");
e.currentTarget.classList.remove("modal-visible");
});


$('.modal').on('hidden.bs.modal', function(e)
{
e.currentTarget.classList.add("modal-hidden");
e.currentTarget.classList.remove("modal-fading-in");
e.currentTarget.classList.remove("modal-fading-out");
e.currentTarget.classList.remove("modal-visible");
});


$('.modal').on('shown.bs.modal', function(e)
{
e.currentTarget.classList.add("modal-visible");
e.currentTarget.classList.remove("modal-fading-in");
e.currentTarget.classList.remove("modal-fading-out");
e.currentTarget.classList.remove("modal-hidden");
});

然后您可以使用 JS 和 CSS 轻松地定位模态的各种状态。

JS 的例子:

if (document.getElementById('myModal').hasClass('modal-fading-in'))
{
console.log("The modal is currently fading in. Please wait.");
}

CSS 示例:

.modal-fading-out, .modal-hidden
{
opacity: 0.5;
}

小开

我尝试这样与函数，然后调用，如果需要一个这个函数。已经为我工作。

function modal_fix() {
var a = $(".modal"),
b = $("body");
a.on("shown.bs.modal", function () {
b.hasClass("modal-open") || b.addClass("modal-open");
});
}

小开

这解决了您的问题，如果真的没有刷新，错误的刷新

var truFalse = $('body').hasClass('modal-open');