Jak ukryć wiele selektorów jak kiedyś z jQuery

Question

Jak to się stało ..

$("div.toggle1").hide(); 
    $("div.toggle3").hide(); 
      $("div.toggle4").hide(); 
      $("div.toggle5").hide(); 

nie equvalent do tego ...

  $('#container div').not('.toggle2').hide(); 

który występuje na zdarzenia click, ale nie robi” t działa tak samo, jak ręczne wpisywanie wielu tagów hide(). Po prostu próbuję zmniejszyć użycie tagu hide() dla każdego elementu div, który nadal dodajemy do mojego elementu nadrzędnego #container div.

Answer 1

$("div.toggle1, div.toggle3, div.toggle4, div.toggle5").hide(); 

Albo po prostu dać każdy element DOM że ukryjesz tę samą klasę i można po prostu zrobić:

$('.hideClass').hide(); 

Answer 2

można łatwo kontrolować za pomocą CSS. Dodaj ukrytą klasę do kontenera nadrzędnego, który będzie zawierał styl display:none. Jeśli nie chcesz, aby display:none dla div z klasą toggle2 zastąpiłeś styl tego elementu. W ten sposób nie musisz wywoływać ukrywania na wszystkich kontenerach ani wybierać wszystkich kontenerów i wywoływać metody ukrywania.

Spróbuj

.hidden{ 
    display:none; 
} 

.hidden .toggle2{ 
    display:block; 
} 

//This will add hidden class to the container which will 
//ultimately hide all the inner divs except div with class toggle2 
$('#container').addClass('hidden');