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

时间:2017-04-18 16:31:24

标签: jquery

我正在建立一个论坛网站,对于每个帖子部分,都有一个评论部分,所以我为每个帖子建立一个链接来显示/隐藏评论。

问题在于,每次按下链接时,只会显示第一条评论,其余评论则不会显示。我的问题是,我做错了什么?我应该在隐藏的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)) 
{
		//post content here...			
          ?>
 <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"); 
				   $comments ->bindParam(':topic_id',$topic_id);
				   $comments ->bindParam(':post_id',$row2['post_id']);
				   $comments -> execute();
				   while ($comments_res = $comments -> fetch(PDO::FETCH_ASSOC)) {
           ?>
 <div id="comments-section2<?php echo $row2['post_id']; ?>" style="display:none">
          				   <ul class="replies">
				    <li class="cmmnt">
				      <div class="avatar"><a href="javascript:void(0);"><img src="images/default.png" width="55" height="55" alt="avatar"></a></div>
				      <div class="cmmnt-content" id="<?php echo $comments_res['id'] ;?> ">
				      <header><a href="javascript:void(0);" class="userlink"><?php 
					$online_uid3 = $conn -> prepare("SELECT online FROM user WHERE uid=:uid");
					$online_uid3 -> bindParam(':uid',$comments_res['uid']);
					$online_uid3 -> execute();
					$online_uid_result3 = $online_uid3 -> fetch(PDO::FETCH_ASSOC);
					if ($online_uid_result3['online'] == "on") {
					echo '<img src="images/online.png" alt="online">	<font size="3pt">'.$comments_res['uid'].'</a><font color=#7aa74d size="3pt"> (online) </font>';
					} else {
					echo '<img src="images/offline.png" alt="offline">	<font size="3pt">'.$comments_res['uid'].'</a><font color=#B8101F size="3pt"> (offline) </font>';
					}
					?>
					  </a> - <span class="pubdate"><?php echo '<font size="2pt">'.$comments_res['date'].'</font>' ; ?></span></header>
					<div class="show">	<?php echo $comments_res['comment'] ; ?> </div>
				      </div> 
				    </li>
				  </ul>
</div>
          <?php }
                  }
                  ?>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

我找到了我的问题的解决方案,我尝试了以下jquery脚本,并在div上添加了帖子的id。我认为使用toogle方法的问题就是问题。

&#13;
&#13;
jQuery(function(){

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

相关问题