Question

我的div#content里面有3个div（product-a-content，product-b-content和product-c-content），每个人都有一些子元素。在任何时候，只有3个div中的一个应该是可见的。更改活动div的代码是：

    $('.mainmenuitem').click(function(){
        $('#content div').hide();
        $('#content div#' + this.id + '-content').show();
    });

标记：

<div id="mainmenu">
    <div id="product-a" class="mainmenuitem"></div>
    <div id="product-b" class="mainmenuitem"></div>
    <div id="product-c" class="mainmenuitem"></div>
    <div style="clear: both;"></div>
</div>
<div id="content" class="box">
        <div id="product-a-content"><?php echo $product_a_info; ?></div>
        <div id="product-b-content"><?php echo $product_b_info; ?></div>
        <div id="product-c-content"><?php echo $product_c_info; ?></div>
</div>

它们变为hide但未激活，则无法激活。（我甚至确定返回了正确的id）。

Answer 1

$('#content div')隐藏div内的所有#content，即使是#content元素的间接子元素，当您显示它时，您只显示直接子div。< / p>

隐藏元素时，只需要隐藏直接div

尝试

$('.mainmenuitem').click(function(){
    $('#content > div').hide();
    $('#' + this.id + '-content').show();
});

jQuery.hide（）隐藏，但.show（）不会显示它们

1 个答案: