Div显示/隐藏 - 隐藏所有div

时间:2013-10-01 19:19:24

标签: jquery html

我有jquery显示3个不同的div来显示/隐藏onclick。 Everthing按要求工作,只是一旦打开它我就无法隐藏它。

HTML

<table id="brand-groups">
  <tr>
    <td id="brandgroupopen-all" class="brand-groups-tab" valign="middle"> ALL BRANDS</td>
    <td id="brandgroupopen-fashion" class="brand-groups-tab" valign="middle">POPULAR FASHION BRANDS</td>
    <td id="brandgroupopen-beauty" class="brand-groups-tab" valign="middle">POPULAR BEAUTY</td>
  </tr>
</table>
<div class="brandgroupoptions">
 <div id="brandgroupoptions-all" class="brandgroupoption init-hidden">a</div>
 <div id="brandgroupoptions-fashion" class="brandgroupoption init-hidden">fashion</div>
 <div id="brandgroupoptions-beauty" class="brandgroupoption init-hidden">beauty</div>
</div>

Jquery的

$('.brand-groups-tab').click(function(){

    var myId = $(this).attr('id').replace('brandgroupopen-', '');

    $('.init-hidden').hide();
    $('#brandgroupoptions-' + myId).slideToggle("slow");

});

这里是小提琴链接:http://jsfiddle.net/soniayastays/HHj3N/

2 个答案:

答案 0 :(得分:3)

隐藏<div class="brandgroupoptions">内的所有div:

$('.brandgroupoptions div').hide();

答案 1 :(得分:0)

没有完全明白你究竟在寻找什么,但可能是这样:

$('.brand-groups-tab').click(function(){

    var myId = $(this).attr('id').replace('brandgroupopen-', '');

    $('.init-hidden').hide();
    if (myId == 'all')
        $('.brandgroupoptions div').slideToggle("slow");
    else
    $('#brandgroupoptions-' + myId).slideToggle("slow");

});