jQuery或PHP - 如果啓用/禁用另一個DIV，則顯示/隱藏DIV或LI

我還有一個問題，不確定這是通過PHP還是jQuery實現的，所以我將它發佈在兩個部分中。jQuery或PHP - 如果啓用/禁用另一個DIV，則顯示/隱藏DIV或LI

基本上我想是這樣的：

我有一個頁面上的一些資料覈實，其中包括4個格題爲「春」，「夏」，「秋」和「冬」。

我有另一個稱爲「菜單」的DIV。在菜單中，您可以通過jQuery切換四個季節DIV中的每一個。還有幾個列表項目，例如「溜冰場」和「冰淇淋店」。「冰場」只有在選擇「冬季」時纔可用，而在選擇夏季時則爲「冰淇淋店」。

我想要做的，最好通過jQuery，當啓用「Winter」DIV時，從菜單隱藏「Ice Cream Stores」，或啓用「Summer」DIV時隱藏「Ice Rinks」。基本上，我需要一種選擇性的方式，或者動態地（可能通過列表項上的一個類）將菜單項分配給4個季節DIVS中的一個，然後在相關季節中隱藏這些菜單項DIV被切斷。

這是可能的，如果是這樣，是否有人有任何代碼示例如何實現？

感謝扎克

來源

2011-04-25 Zach Nicodemous

您可以添加HTML代碼？ – Phliplip 2011-04-25 09:31:14

這裏 - http://jsfiddle.net/vDxRC/ – stealthyninja 2011-04-25 10:03:24

這是可能的。你可以這樣做

HTML：

<div id="spring" class="menubtn">Spring</div> 
<div id="summer" class="menubtn">Summer</div> 
<div id="autumn" class="menubtn">Autumn</div> 
<div id="winter" class="menubtn">Winter</div> 
<ul id="itemlist"> 
    <li class="winter">Ice Rinks</li> 
    <li class="summer">Ice Cream Stores</li> 
</ul>

的Javascript：

$(document).ready(function(){ 
    $('.menubtn').click(function(){ 
     // Handle Menu 
     $('.menubtn').removeClass('active') 
     $(this).addClass('active'); 

     // Handle item list. This is what you want to do 
     $('#itemlist li').hide(); 
     $('#itemlist li.' + $(this).attr('id')).show(); 
    }); 
});

您可以在這裏看到演示：http://jsfiddle.net/ynhat/Cgeus/3/

來源

2011-04-25 09:41:01 YNhat

jQuery或PHP - 如果啓用/禁用另一個DIV，則顯示/隱藏DIV或LI

回答

相關問題