显示/隐藏div无法正常工作

-1

我正在构建论坛网站，对于每个帖子部分，都有一个评论部分，因此我会为每个帖子创建一个链接来显示/隐藏评论。显示/隐藏div无法正常工作

的问题是，我每次按下链接时，只有第一评论显示出来，其余的则没有。我的问题是，我做错了什么？我应该在隐藏的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 } 
 
        } 
 
        ?>

来源

2017-04-18 Ioannis Pantelidis

，PHP代码混浊的JavaScript将看到实际的标记。你能展示一个证明问题的实际标记的最小例子吗？ – David

这是来自网站的捕获：https：//i.stack.imgur.com/AfSj9.png。 “评论编号：1”只显示，但其他评论没有。 –

输出的图片与呈现该输出的HTML不同。我们无法看到您没有向我们展示的内容。 – David

我找到了解决我的问题，我想下面的jQuery脚本和我加了帖子的ID了div。我认为toogle方法有些问题。

jQuery(function(){ 
 

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

来源

2017-04-18 17:34:14

显示/隐藏div无法正常工作

回答

相关问题