检查jquery是否显示模态处于活动状态，执行某些操作 [英] check if jquery reveal modal is active, do something

问题描述

我试图仅在显示模式处于活动状态的情况下运行一些javascript.问题是无论模态是否处于活动状态，我尝试的方法都为True.下面是我要完成的示例.我尝试过:is可见方法，也:active.我正在使用zurb显示模式.

I am trying to run some javascript ONLY on the condition that the reveal modal is active. The problem is that the methods I have tried have been True whether the modal is active or not. Below is an example of what I am trying to accomplish. I have tried :is visible method, also :active. I am using zurb reveal modal.

html:

<div id="myModal" class="reveal-modal">
    <ul>
        <li>some list item</li>
        <li>some list item</li>
    </ul>
</div> <!--/myModal-->

JS:

<script>
    if ($('#myModal:active').length){
        console.log('yes'); //always yes even when not revealed
    } else { 
        //do nothing
    }
</script>

//also tried if ($('#myModal').hasClass('someClass')) 

编辑

当激活时，CSS的可见性"为:可见"，否则为隐藏"，因此我尝试了以下操作，但没有响应条件.为什么会发生这种情况的任何想法?

when active there is CSS of "visibility" : "visible", otherwise "hidden" so I tried the following, but it is not responding to the conditional. Any ideas why that might happen?

if($("#myModal").css("visibility", "hidden").length > 0) {
    console.log('is hidden');
} else {
    console.log('is shown');
}

这是Cookie代码，其中 Zurb的选项用于显示弹出窗口.

This is the cookie code with Zurb's options for the reveal popup.

if (document.cookie.indexOf('visited=true') == -1) {
    var tenYears = 3600 * 1000 * 24 * 365 * 10;   //1000*60*60*24*15;//15days
    var expires = new Date((new Date()).valueOf() + tenYears);
    document.cookie = "visited=true;expires=" + expires.toUTCString() +  ";path=/";  //encodeURIComponent +
    // Zurb's popup reveal modal
    $('#myModal').reveal({
        animation: 'fadeAndPop', 
        animationspeed: 100,                      
        closeonbackgroundclick: true,              
        dismissmodalclass: 'close-reveal-modal'
    });
}

推荐答案

好像此插件在单击时激活打开"类.因此，您应该检查链接，例如:

Seems as though this plugin activates a "open" class when clicked. So you should check the link like:

if($(".modal-link").hasClass('open')) {
    //do stuff when modal active
} else {
    //do stuff when modal not active
}

更好:

if($("#my-Modal").is(":visible")) {
    //you get the point
}

这篇关于检查jquery是否显示模态处于活动状态，执行某些操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！