顯示/隱藏多個元素

Question

不必管了許多基於一些邏輯檢查的DOM元素的可見性 - 我真的想在jQuery的是這樣的：

$('.FirstPanel').visible = (condition == 1 || othercondition == true); 
$('.SecondPanel').visible = (condition > 3 || othercondition == false); 
$('.ThirdPanel').visible = (condition < 3 || stillanothercondition = 'asdf'); 
etc 

我當然可以表達上面的代碼使用if或switch語句並調用$('.FirstPanel').hide() ...但它會需要很多倍的代碼行數。

if(condition == 1 || othercondition == true) { 
    $('.FirstPanel').show(); 
    $('.SecondPanel').hide(); 
    $('.ThirdPanel').hide(); 
} else if (condition > 3 || othercondition == false) { 
    $('.FirstPanel').hide(); 
    $('.SecondPanel').show(); 
    $('.ThirdPanel').hide(); 
} etc 

我覺得我失去了一些明顯的東西。由於

---

2012年9月24日更新

感謝您的答案大家 - 切換方法是門票（見下邁克爾Witrant的接受的答案）

Answer 1

$('.FirstPanel').toggle(condition == 1 || othercondition == true); 
$('.SecondPanel').toggle(condition > 3 || othercondition == false); 
$('.ThirdPanel').toggle(condition < 3 || stillanothercondition = 'asdf'); 

http://api.jquery.com/toggle/

Answer 2

試着這麼做：

$(".element").css("display", function() { value = (condition == 1 || othercondition == true); if (value) { return 'block'; /*or 'inline' or 'inline-block'*/ } 
return 'none'; });