如何检查引导模式是否打开，以便我可以使用 jquery 验证？

我需要做一个验证只有当模态是打开的，因为如果我打开它，然后我关闭它，我按下按钮，打开模态它不工作，因为它正在进行 jquery 验证，但没有显示，因为模态被拒绝。

所以我想广告一个 jquery，如果模态是打开的，所以我确实验证，这是可能的吗？

<script>
$(document).ready(function(){


var validator =$('#form1').validate(
{
ignore: "",
rules: {


usu_login: {
required: true
},
usu_password: {
required: true
},
usu_email: {
required: true
},
usu_nombre1: {
required: true
},
usu_apellido1: {
required: true
},
usu_fecha_nac: {
required: true
},
usu_cedula: {
required: true
},
usu_telefono1: {
required: true
},
rol_id: {
required: true
},
dependencia_id: {
required: true
},
},


highlight: function(element) {
$(element).closest('.grupo').addClass('has-error');
if($(".tab-content").find("div.tab-pane.active:has(div.has-error)").length == 0)
{
$(".tab-content").find("div.tab-pane:hidden:has(div.has-error)").each(function(index, tab)
{
var id = $(tab).attr("id");
        

$('a[href="#' + id + '"]').tab('show');
});
}
},
unhighlight: function(element) {
$(element).closest('.grupo').removeClass('has-error');
}
});


}); // end document.ready


</script>
225998 次浏览
小开

你可以用

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

Bootstrap 在模态打开时添加 in类，在关闭时删除它

小开
最佳答案

为了避免 GregPettit 提到的竞争条件，可以使用:

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


// or, with the optional chaining operator (?.)
$("element").data('bs.modal')?._isShown    // Bootstrap 4
$("element").data('bs.modal')?.isShown     // Bootstrap <= 3

正如在 Bootstrap 模态-图示中所讨论的。

当模态尚未打开时，.data('bs.modal')返回 undefined，因此 || {}-将使 isShown成为(假的)值 undefined。如果你很严格，你可以做 ($("element").data('bs.modal') || {isShown: false}).isShown

小开

您还可以直接使用 jQuery。

$('#myModal').is(':visible');
小开 
$("element").data('bs.modal').isShown

如果模态之前没有显示过，那么它就不会工作。你需要添加一个额外的条件:

$("element").data('bs.modal')

考虑到第一次出现的情况，答案是:

if ($("element").data('bs.modal') && $("element").data('bs.modal').isShown){
...
}
小开

在 bootstrap-modal.js v2.2.0上:

( $('element').data('modal') || {}).isShown
小开

检查模态是否打开

$('.modal:visible').length && $('body').hasClass('modal-open')

附加事件侦听器

$(document).on('show.bs.modal', '.modal', function () {
// run your validation... ( or shown.bs.modal )
});
小开

Bootstrap 2,3 Check 是页面中打开的任何模式:

if($('.modal.in').length)

兼容版本 引导2,3,4 + 

if($('.modal.in, .modal.show').length)

只有 引导程序4 + 

if($('.modal.show').length)
小开

你也可以用

$('#myModal').hasClass('show');
小开

为什么要把事情复杂化呢? 它可以通过简单的 jQuery 来完成，比如下面这个。

$('#myModal').on('shown.bs.modal', function (e) {
console.log('myModal is shown');
// Your actual function here
})
小开

作为一个解决方案，我个人使用一个自定义的全局标志来确定模式是否已经打开，我重置它在‘ Hidden.bs.mode’上

小开

JavaScript 方法通过 ID 检查任何特定的模型状态。

modalstate = document.getElementById('modal-id').classList.contains('show')

如果打开特定的 mode-id，则返回 true。

小开

此代码指示，当模态是打开(在主体) ，或关闭(结果为假)

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

提交答案