Question

这是我的代码：

  <div id="principal" class="classxx">
    <div class="class001 cat2 blabla">
      <div class="class002">
        <div class="class003"></div>
        <div class="class004"></div>
        <div class="class005"></div>
      </div>
    </div>
    <div class="class001 cat3 blabla">
      <div class="class002">
        <div class="class003"></div>
        <div class="class004"></div>
        <div class="class005"></div>
      </div>
    </div>
    <div class="class001 cat1 blabla">
      <div class="class002">
        <div class="class003"></div>
        <div class="class004"></div>
        <div class="class005"></div>
      </div>
    </div>
  </div>

我需要一个像：

这样的功能

function showOnlyCat(className){}

如果我致电showOnlyCat('cat3')我想只看到所有拥有'cat3'类的DIV（每个DIV都有多个类）及其子级当然

我还需要showAllCat()显示所有cat1，cat2，cat3 ...... DIV

非常感谢你的帮助

Answer 1

试试这个：

function showOnlyCat(cat) {
    $('div').not('.'+cat).hide();
}
function showAllCat() {
    $('div').show();
}

Answer 2

试试这个：

$('div.cat').siblings().hide();

所有以班为猫的div的兄弟姐妹都将被隐藏。

$('div.cat').show();

将显示所有以班级为猫的div。

Answer 3

function showOnlyCat(cat){

 $('.class001').hide();
 $('.'+ cat).show();
}

function showAllCat(){
  $('.class001').show();
}

当class001是对的时候就是这样。

Answer 4

function showOnlyCat(className) {
  $('div').not('.' + className).hide();
}

function showAllCat() {
  for (i=1;i<=NUM_CAT;i++) {
    $('.cat' + i).show();
  }
}

Answer 5

真的可以通过一个功能来实现

function toggleVisibility(className){
     if(typeof(className)!='undefined' && className != null){
        $("div").hide();         
        $("div."+className).show();
     }
   else
        $("div").show();
}

//仅显示class001 toggleVisibilty（ 'class001'）; //显示全部 toggleVisibility（）;

jquery - 隐藏除一个类之外的所有div

5 个答案: