divが正しく表示されない

Question

私はフォーラムサイトを構築しています。投稿セクションごとにコメントセクションがありますので、投稿を表示/非表示にするリンクを作成します。

問題は、リンクを押すたびに最初のコメントだけが表示され、残りは表示されないということです。私の質問は、何が間違っているのですか？私は隠されたdivのコメントのIDを含める必要がありますか？

$(function(){ 
 
    $('.showcomments2').on('click', function(e){ 
 
     e.preventDefault(); 
 
     $("comments-section2").css("display","none"); 
 
     var TargetDiv = $(this).attr("data-target"); 
 
     $("#" + TargetDiv).toggle(); 
 
    }); 
 
});

<script src="js/jquery-3.1.0.min.js"></script> 
 

 
<?php 
 
$result_posts = $conn -> prepare("SELECT * FROM posts WHERE post_topic=:post_topic ORDER BY DATE(post_date) ASC"); 
 
$result_posts -> bindParam(':post_topic',$topic_id); 
 
$result_posts -> execute(); 
 
while ($row2 = $result_posts ->fetch(PDO::FETCH_ASSOC)) 
 
{ 
 
\t \t //post content here... \t \t \t 
 
      ?> 
 
<a class="showcomments2" data-target="comments-section2<?php echo $row2['post_id']; ?>"><p align="right"><font color=#2b2d41 size="2pt">Show Comments</font></p></a> 
 
<?php $comments = $conn -> prepare("SELECT uid,comment,date FROM comments WHERE topic_id=:topic_id AND post_id=:post_id ORDER BY DATE(date) ASC"); 
 
\t \t \t \t $comments ->bindParam(':topic_id',$topic_id); 
 
\t \t \t \t $comments ->bindParam(':post_id',$row2['post_id']); 
 
\t \t \t \t $comments -> execute(); 
 
\t \t \t \t while ($comments_res = $comments -> fetch(PDO::FETCH_ASSOC)) { 
 
      ?> 
 
<div id="comments-section2<?php echo $row2['post_id']; ?>" style="display:none"> 
 
      \t \t \t \t <ul class="replies"> 
 
\t \t \t \t  <li class="cmmnt"> 
 
\t \t \t \t  <div class="avatar"><a href="javascript:void(0);"><img src="images/default.png" width="55" height="55" alt="avatar"></a></div> 
 
\t \t \t \t  <div class="cmmnt-content" id="<?php echo $comments_res['id'] ;?> "> 
 
\t \t \t \t  <header><a href="javascript:void(0);" class="userlink"><?php 
 
\t \t \t \t \t $online_uid3 = $conn -> prepare("SELECT online FROM user WHERE uid=:uid"); 
 
\t \t \t \t \t $online_uid3 -> bindParam(':uid',$comments_res['uid']); 
 
\t \t \t \t \t $online_uid3 -> execute(); 
 
\t \t \t \t \t $online_uid_result3 = $online_uid3 -> fetch(PDO::FETCH_ASSOC); 
 
\t \t \t \t \t if ($online_uid_result3['online'] == "on") { 
 
\t \t \t \t \t echo '<img src="images/online.png" alt="online"> \t <font size="3pt">'.$comments_res['uid'].'</a><font color=#7aa74d size="3pt"> (online) </font>'; 
 
\t \t \t \t \t } else { 
 
\t \t \t \t \t echo '<img src="images/offline.png" alt="offline"> \t <font size="3pt">'.$comments_res['uid'].'</a><font color=#B8101F size="3pt"> (offline) </font>'; 
 
\t \t \t \t \t } 
 
\t \t \t \t \t ?> 
 
\t \t \t \t \t </a> - <span class="pubdate"><?php echo '<font size="2pt">'.$comments_res['date'].'</font>' ; ?></span></header> 
 
\t \t \t \t \t <div class="show"> \t <?php echo $comments_res['comment'] ; ?> </div> 
 
\t \t \t \t  </div> 
 
\t \t \t \t  </li> 
 
\t \t \t \t </ul> 
 
</div> 
 
      <?php } 
 
        } 
 
        ?>

Answer 1

私は、私の問題への解決策を見つけた私は、次のjqueryのスクリプトを試してみましたが、私はdivの上のポストのIDを追加しました。私はtoogleの方法で何かが問題だと思う。

jQuery(function(){ 
 

 
     jQuery('.showcomments2').click(function(){ 
 
      jQuery('.comments-section2').toggle(); 
 
     }); 
 
});