顯示UL中的所有LI，而不是隻顯示點擊的LI。

Question

我對javascript/jquery很新穎 - 我有一個嵌套uls的分銷商列表，我想顯示/隱藏該區域（顯示該區域中的所有分銷商）。它顯示和隱藏，但所有的區域，而不是一個我想要的 - 任何幫助一如既往

我的標記

{foreach $regions index region} 

<ul class="stockists"> 

    <li> 
     <div class="regionHeader"> 

      <span class="regionTitle">{$region.label}</span><span class="regionView">View</span> 

     </div> 

     <ul class="region"> 
      <li> 

      {$stockists = $region.stockists} 

      {foreach $stockists index stockist} 

         <ul> 
         <li class="stockistName">{$stockist.name}</li> 
         <li>{$stockist.address1}</li> 
         <li>{$stockist.address2},{$stockist.city}</li> 
         <li>T : {$stockist.telephone}</li> 
         <li>W : {$stockist.website}</li> 
         <li><span class="productsButton">Products Stocked</span><span class="mapButton">View on Map</span></li> 
         </ul> 

      {/foreach} 

      </li> 

     </ul>   

    </li> 

</ul>     


{/foreach} 

我的javascript

var stockists = { 

start: function() { 

    $('.region').hide(); 
      $('.regionTitle').click(function(e) { 
       e.preventDefault(); 
       $('.region').slideToggle(200); 
      }) 

} 

}; 

$(stockists.start); 

感謝尋找大爲讚賞，豐富的:)

Answer 1

我已經整理了，我需要一個元素上去，還沒等我下一次去...糾正行

$(this).parent().next('.region').slideToggle(300); // where .parent is the containing element of .regionTitle, which is div with class regionHeader. 

感謝您的幫助雖然傢伙，@ gaurav讓我看在正確的地方:)

Answer 2

代碼：

$('.region').slideToggle(200); 

切換類「區域」的所有元素。 $('.region')如果您只需切換一個元素，則只需選擇其中的一個元素即可添加使用該功能，從而選擇具有「區域」類別 的所有元素。

Answer 3

嘗試：

var stockists = { 
start: function() { 

$('.region').hide(); 
     $('.regionTitle').each(function(){ 
     $(this).click(function(e) { 
      e.preventDefault(); 
      $(this).next('.region').slideToggle(200);//here is the change basically it will show/hide only the region next to the clicked regionTitle. 
     }); 
     }); 

} 
}; 
$(stockists.start);