JQuery .not() 函数无法正常工作

Question

所以我在使用 jQuery .not() 函数时遇到了问题。

所有 div 都通过切换正常进行折叠，但问题在于关闭所有其他 div 类。如果您打开了第一个 div，点击任何其他 div 会关闭它，但如果您先点击任何其他 div，然后再点击另一个，它们不会关闭。

这里是代码

function hideNot(id) {
    $("#teamMemberDescription").not("." + id).hide();
}

$("#teamMember.paulturner").click(function(){
    hideNot("paulturner");
    $("#teamMemberDescription.paulturner").toggle(500);
});

$("#teamMember.paulblake").click(function(){
    hideNot("paulblake");
    $("#teamMemberDescription.paulblake").toggle(500);
});

$("#teamMember.bobhook").click(function(){
    hideNot("bobhook");
    $("#teamMemberDescription.bobhook").toggle(500);
});

$("#teamMember.yvonnemclean").click(function(){
    hideNot("yvonnemclean");
    $("#teamMemberDescription.yvonnemclean").toggle(500);
});

这是html

<div id="standardContainer" class="teamPage">
        <div id="standardContent">

                <h1 class="entry-title"><whiteblocker>MEET THE TEAM</whiteblocker></h1>

                <div id="teamBanner">
                    <img src="<?php the_field('team_group_image');?>" width="100%">
                </div>

                <div id="teamDescription">
                    <h2>PREVENTEC - WHO WE ARE</h2>
                    <?php the_field('team_description');?>
                </div>

                <div id="teamMembers">
                    <?php if(get_field('team_members')): ?>         
                        <?php while(the_repeater_field('team_members')): ?>
                            <?php $memberName = get_sub_field('member_name');?>
                            <?php $memberName = str_replace(" ","", $memberName);?>
                            <?php $memberName = strtolower($memberName);?>

                            <div id="teamMember" class="<?php echo $memberName;?>">
                                <img src="<?php the_sub_field('member_photo');?>">
                                <div class="teamMemberDetails">
                                    <h3><?php the_sub_field('member_name');?></h3>
                                    <h4><?php the_sub_field('member_position');?></h4>
                                </div>
                            </div>

                        <?php endwhile; ?>
                    <?php endif;?>  
                </div>  

        </div>
    </div>

    <div id="teamDetailsContainer">
        <div id="teamDetailsContent">
            <?php if(get_field('team_members')): ?>         
                <?php while(the_repeater_field('team_members')): ?>
                    <?php $memberName = get_sub_field('member_name');?>
                    <?php $memberName = str_replace(" ","", $memberName);?>
                    <?php $memberName = strtolower($memberName);?>

                    <div id="teamMemberDescription" class="<?php echo $memberName;?>">
                        <h1><?php the_sub_field('member_name');?></h1>
                        <?php the_sub_field('member_description');?>
                    </div>
                <?php endwhile; ?>
            <?php endif;?>
        </div>
    </div>

任何帮助将不胜感激

Answer 1

只是猜测：你的结构应该是

// HTML
<div id="description">
    <div id="paul">...</div>
    <div id="...">...</div>
</div>

// JQUERY
function hideNot(name) {
    $("#description > div").not("#" + name).hide();
}