由Jquery單擊顯示div只適用於1 div一次

Question

我正在使用wordpress並在我的循環中我有一個可點擊的鏈接來切換div來顯示和隱藏內容，因爲這是在循環內它爲循環中的每個項目使用相同的類，因此當我切換一個鏈接時，它會顯示所有內容。

<div class="additional-info">Additinal Information</div> 

<div class="additional-info-box"> 
    <?php echo $additional_info; ?> 
</div> 


<script type="text/javascript"> 
$(document).ready(
    function(){ 
     $(".additional-info").click(function() { 
      $(".additional-info-box").toggle(); 
     }); 
    }) 
</script> 

所以附加信息類和附加信息框獲取每個職位產生，但是當我點擊任何附加信息的div的附加信息框被顯示。

Answer 1

儘量包裹：

<div class="additional-info"> 
    Additinal Information 
    <div class="additional-info-box"> 
     <?php echo $additional_info; ?> 
    </div> 
</div> 

<script type="text/javascript"> 
$(document).ready(
    function(){ 
     $(".additional-info").click(function() { 
      $(this).find(".additional-info-box").toggle(); 
     }); 
    }) 
</script> 

與只有.additional-info點擊會顯示其內容。

Live Demo