检查类和是否在页面加载中隐藏了 DIV

Check Class and If a DIV is hidden on Pageload

本文关键字：加载 隐藏 DIV 是否 检查      更新时间：2023-09-26

我有一个切换，目前它的工作原理是这样的：

如果单击.member-button，它将.active-sub添加到.member-button并将其从.trainer-button中删除。它还将在隐藏#trainer时显示#member

.trainer-button的工作方式与将.active-sub添加到.trainer-button的方式相同，同时将其从.member-button中删除，并且在隐藏#member时将显示#trainer。

我遇到的问题是当页面首次加载时，如何检查.active-sub是否已添加到.member-button中，如果是，请将其从.trainer-button中删除？(反之亦然(

我还想检查#member是否未设置为$("#member").hide();然后自动隐藏#trainer

Javascript： 

<script type="text/javascript">
    $(document).ready(function(){
        //$("#member").hide();
        $("#fitness-trainer").hide();
        $('.member-button').addClass("active-sub");
        $('.member-button').click(function () {
            $("#fitness-trainer").fadeOut(function () {
                $("#member").fadeIn();
            });
            $(".trainer-button").removeClass("active-sub");
            $(this).addClass("active-sub");
        });
        $('.trainer-button').click(function () {
            $("#member").fadeOut(function () {
                $("#fitness-trainer").fadeIn();
            });
            $(".member-button").removeClass("active-sub");
            $(this).addClass("active-sub");
        });
    });
</script>

HTML：按钮

<a href="#" class="member-button">Member</a>
<a href="#" class="trainer-button">Trainer</a>

目录：内容

<div id="member">
member content
</div>
<div id="trainer">
trainer content
</div>

if($('.member-button').hasClass('active-sub'))
{
$('.member-button').removeClass('active-sub');
$('.trainer-button').addClass('active-sub');
}

反之亦然。

和：

if($('#member').is(':visible'))
{
$('#trainer').hide();
}

就像之前的答案一样。

尝试使用，

通过执行以下操作检查.member-button是否具有类.active-sub，

$('.member-button').hasClass('active-sub');

如果它有类，这将返回 true

您可以通过以下方式检查 #member 是否设置为 .hide((，

if($("#member").is(":visible")){
  // hide whatever you want here...
}else{
  // display whatever you want here..
}
相关文章：