PHP foreachループでjQueryトグル

Question

codeigniter 3.xを使用

私はforeachループを使用してデータベースからデータを取得しようとしています。

<h3 style="margin-right:15px;" id='hideshow'>August 2016</h3> 
<?php foreach($duxeos as $e): ?> 
<div class='content' ><h4 class="dropdate"><?php echo $e->fulldate;?></h4><div class="cdropdate" class="defhide"><?php echo $e->content;?></div></div> 
<?php endforeach; ?> 

のjavascript：私は非表示ボタンを押したときに、それが働いている今

jQuery(document).ready(function(){ 
     jQuery('.hideshow').live('click', function(event) { 
      jQuery('.content').toggle('show'); 
     }); 
    }); 

    jQuery(document).ready(function(){ 
     jQuery('.dropdate').live('click', function(event) { 
      jQuery('.cdropdate').toggle('show'); 
     }); 
    }); 

、しかし、それは、どのように私はしたいコンテンツを非表示にすることができ、すべてのコンテンツを非表示にするには？

Answer 1

• 使用thisコンテキストhandler-function
• 使用.on代わり.live
• の使用.closestでは、それの子を見つけるために最も近い要素を取得します。

jQuery(document).ready(function() { 
 
    jQuery('.dropdate').on('click', function(event) { 
 
    jQuery(this).closest('.content').find('.cdropdate').toggle(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<h3 style="margin-right:15px;" id='hideshow'>August 2016</h3> 
 
<div class='content'> 
 
    <h4 class="dropdate">Full-Date</h4> 
 
    <div class="cdropdate defhide">Content</div> 
 
</div> 
 
<hr> 
 
<div class='content'> 
 
    <h4 class="dropdate">Full-Date</h4> 
 
    <div class="cdropdate defhide">Content</div> 
 
</div>