评论和子评论形式:在 while 循环 (php) 中显示和隐藏它时出现问题,并且基于 jquery 脚本逻辑
Comment and subcomment form: problems when showing and hiding it inside while loop (php) and based on a jquery script logic
问题出在我的两个表单上(用于用户的评论和子评论)。我已经实现了 jquery 代码,以便在单击 "reply" 按钮时可以显示或隐藏此表单。好吧,伙计,到目前为止一切顺利。但我注意到,经过几次测试后,这对评论有效,但对子评论无效。
它在子评论上有效,但仅在我发布的子评论和我登录自己的系统时有效。在其余的子评论上,它不起作用,当我单击辅助评论或子评论 "reply" 按钮时,它不显示或隐藏任何内容,其他按钮如 "delete" 和 "edit" 看起来不活跃,根本不工作。嗯,这是我的第一个问题。现在,我的第二个问题是跨度 "view replies".
当我点击它时,它会立即隐藏所有带有 class“.replies”的 "ul"(无序列表)(其中有主评论的子评论)而不是一个像我喜欢的那样(隐藏和显示切换)。此外,当我再次单击它时,它根本不会重新显示。这是 jQuery 代码:
$(document).ready(function(){
$(document).on('click' , '.reply' , function(){
var closestDiv = $(this).closest('div'); // also you can use $(this).parent()
//closestDiv.fadeOut();
$('.replyto').not(closestDiv.next('.replyto')).hide();
//$('.reply').closest('div').not(closestDiv).show()
closestDiv.next('.replyto').slideToggle(100);
});
});
上面这个是切换"reply"形式的评论。它在第一级(评论)上工作,但不适用于子评论。
$(document).ready(function(){
$(document).on('click' , '.clicktoviewreplies' , function(){
var closestUl = $(this).closest('ul'); // also you can use $(this).parent()
//closestUl.fadeOut();
$('.replies').not(closestUl.next('.replies')).hide();
//$('.clicktoviewreplies').closest('ul').not(closestUl).show()
closestUl.next('.replies').slideToggle(100);
});
});
上面这个是切换子评论或回复。类似于 "show replies" 和 "hide replies"。这就是整个 php 代码。它基于四个表格:registered_users、视频(虽然这里没有)、评论和子评论,如您所见。
<?php
while($commentslist = $showcomments->fetch()){
$iduser = $commentslist['idUser'];
$idcomment = $commentslist['id'];
$showuser = $pdo->prepare("SELECT * FROM registered_users WHERE id = ?");
$showuser->execute(array($iduser));
while($row6 = $showuser->fetch()){
<li>
<div>
<b><?php echo $row6['username']; ?></b><br>
<?php echo $commentslist['comments']; ?>
<!--additional comment buttons or controllers-->
<?php
if($iduser == $row['id']){ ?> <button>Edit</button><?php }else{ ?> <button>Report</button><?php } ?> <button class="reply">Reply</button><?php if($iduser == $row['id']){ ?> <a onClick="return confirm('You sure you wanna delete that comment there')" href=""><button>Delete</button></a><?php }
?>
</div>
<div class="replyto">
<!--THIS IS TO SUBMIT THE CHILD COMMENTS(SUBCOMMENTS)-->
<form enctype="multipart/form-data" method="post" action="<?php echo "postsubcomment.php?id=$idcomment"; ?>">
<textarea name="subcomment" cols="50" rows="4"></textarea>
<input type="submit" name="reply" value="Submit">
</form>
</div>
<span class="clicktoviewreplies"><b>View replies</b></span> <!--ATTENTION!HERE IT IS WHERE MY PROBLEM IS. I CLICK ON IT AND IT HIDES ALL "UL"(Unordered Lists) WITH CLASS ".REPLIES" AND NOT ONE BY ONE (SWITCHING) LIKE I'D LIKE. AND WHEN I CLICK ON IT AGAIN, IT DOESN'T RESHOW.-->
<!--SECOND LEVEL UNORDERED LIST-->
<ul class="replies">
<!--Subcomments go/show here. This happens everytime the user replies to a main comment-->
<?php
$showsubcomments = $pdo->prepare("SELECT * FROM subcomments WHERE idComment = ?");
$showsubcomments->execute(array($idcomment));
while($subcommentslist = $showsubcomments->fetch()){
$subcommenter = $subcommentslist['idComment'];
$selectcomment = $pdo->prepare("SELECT * FROM comments WHERE id = ?");
$selectcomment->execute(array($subcommenter));
$row7 = $selectcomment->fetch();
//This is to get the parent comment user
$selectuser = $pdo->prepare("SELECT * FROM registered_users WHERE id = ?");
$selectuser->execute(array($row7['idUser']));
$row8 = $selectuser->fetch();
$subcommentslist['idUser']; //The user that made the subcomment
$selectuser2 = $pdo->prepare("SELECT * FROM registered_users WHERE id = ?");
$selectuser2->execute(array($subcommentslist['idUser']));
$row9 = $selectuser2->fetch();
?>
<!--SECOND LEVEL LIST ITEM: This is to show the subcomments-->
<li>
<div>
<?php echo "<b>".$row9['username']; ?>
<?php echo "<br>".$subcommentslist['subcomments']."<br>"; ?>
<!--additional subcomment buttons or controllers-->
<?php
if($row9['id'] == $row['id']){ ?> <button>Edit</button><?php }else{ ?> <button>Report</button><?php } ?> <button class="reply">Reply</button><?php if($row9['id'] == $row['id']){ ?> <a onClick="return confirm('You sure you wanna delete that comment there')" href=""><button>Delete</button></a><?php }
?>
</div>
<div class="replyto" style="margin-left:5%; position:relative;">
<!--THIS IS TO REPLY TO BOTH THE MAIN COMMENT AND SUBCOMMENTS BELOW IT-->
<form enctype="multipart/form-data" method="post" action="<?php echo "postsubcomment.php?id=$idcomment"; ?>">
<textarea name="subcomment" cols="50" rows="4"></textarea>
<input type="submit" name="reply" value="Submit">
</form>
</div>
</li>
<?php
}//THIRD (SUBCOMMENTS) WHILE CLOSED
?>
</ul> <!--SECOND UNORDERED LIST CLOSED -->
</li>
<?php
} //SECOND WHILE CLOSED
} //FIRST WHILE CLOSED
?>
好吧,第一个实例(评论)"reply button "行为有效。为什么不是二审(回复子评论)?我想知道问题是第二个还是第三个 while 循环,或者它可能与 "ul" 和 "li" 安排有关。
嗯,这里的老大会为你解决这些问题,伙计。
对于第二个问题(跨度:"view replies"),将您的代码更改为:
$(document).ready(function(){
$(".clicktoviewreplies").click(function(){
//$(this).closest('ul').next('.replies').hide();
//$('.replies').
$('.replies').not($(this).next('.replies')).css("display", "none");
$(this).next('.replies').slideToggle(100);
});
});
并将文本更改为 "show/hide replies"。
对于第一个问题(回复按钮和评论以及"subcomment"表单),删除"style"标签和所有css,属性"display: none"除外。请记住,jQuery 甚至 Javascript 代码可能会出现故障,因为您正在使用超出 class 本身所需的东西来识别代码中的元素。我不知道如何解释为什么会这样。
所以不要使用:
<div class="replyto" style="margin-left:5%; position:relative;">
使用:
<div class="replyto">
而在 CSS 中,仅使用:
.replyto
{
display: none;
}
还有一个提示:为了拥有结构良好且 "understable" 的代码实现方式,您可以避免使用 "style" 标记并仅使用 CSS 在单独的样式表中组织文档。希望对你有所帮助,伙计。
问题出在我的两个表单上(用于用户的评论和子评论)。我已经实现了 jquery 代码,以便在单击 "reply" 按钮时可以显示或隐藏此表单。好吧,伙计,到目前为止一切顺利。但我注意到,经过几次测试后,这对评论有效,但对子评论无效。
它在子评论上有效,但仅在我发布的子评论和我登录自己的系统时有效。在其余的子评论上,它不起作用,当我单击辅助评论或子评论 "reply" 按钮时,它不显示或隐藏任何内容,其他按钮如 "delete" 和 "edit" 看起来不活跃,根本不工作。嗯,这是我的第一个问题。现在,我的第二个问题是跨度 "view replies".
当我点击它时,它会立即隐藏所有带有 class“.replies”的 "ul"(无序列表)(其中有主评论的子评论)而不是一个像我喜欢的那样(隐藏和显示切换)。此外,当我再次单击它时,它根本不会重新显示。这是 jQuery 代码:
$(document).ready(function(){
$(document).on('click' , '.reply' , function(){
var closestDiv = $(this).closest('div'); // also you can use $(this).parent()
//closestDiv.fadeOut();
$('.replyto').not(closestDiv.next('.replyto')).hide();
//$('.reply').closest('div').not(closestDiv).show()
closestDiv.next('.replyto').slideToggle(100);
});
});
上面这个是切换"reply"形式的评论。它在第一级(评论)上工作,但不适用于子评论。
$(document).ready(function(){
$(document).on('click' , '.clicktoviewreplies' , function(){
var closestUl = $(this).closest('ul'); // also you can use $(this).parent()
//closestUl.fadeOut();
$('.replies').not(closestUl.next('.replies')).hide();
//$('.clicktoviewreplies').closest('ul').not(closestUl).show()
closestUl.next('.replies').slideToggle(100);
});
});
上面这个是切换子评论或回复。类似于 "show replies" 和 "hide replies"。这就是整个 php 代码。它基于四个表格:registered_users、视频(虽然这里没有)、评论和子评论,如您所见。
<?php
while($commentslist = $showcomments->fetch()){
$iduser = $commentslist['idUser'];
$idcomment = $commentslist['id'];
$showuser = $pdo->prepare("SELECT * FROM registered_users WHERE id = ?");
$showuser->execute(array($iduser));
while($row6 = $showuser->fetch()){
<li>
<div>
<b><?php echo $row6['username']; ?></b><br>
<?php echo $commentslist['comments']; ?>
<!--additional comment buttons or controllers-->
<?php
if($iduser == $row['id']){ ?> <button>Edit</button><?php }else{ ?> <button>Report</button><?php } ?> <button class="reply">Reply</button><?php if($iduser == $row['id']){ ?> <a onClick="return confirm('You sure you wanna delete that comment there')" href=""><button>Delete</button></a><?php }
?>
</div>
<div class="replyto">
<!--THIS IS TO SUBMIT THE CHILD COMMENTS(SUBCOMMENTS)-->
<form enctype="multipart/form-data" method="post" action="<?php echo "postsubcomment.php?id=$idcomment"; ?>">
<textarea name="subcomment" cols="50" rows="4"></textarea>
<input type="submit" name="reply" value="Submit">
</form>
</div>
<span class="clicktoviewreplies"><b>View replies</b></span> <!--ATTENTION!HERE IT IS WHERE MY PROBLEM IS. I CLICK ON IT AND IT HIDES ALL "UL"(Unordered Lists) WITH CLASS ".REPLIES" AND NOT ONE BY ONE (SWITCHING) LIKE I'D LIKE. AND WHEN I CLICK ON IT AGAIN, IT DOESN'T RESHOW.-->
<!--SECOND LEVEL UNORDERED LIST-->
<ul class="replies">
<!--Subcomments go/show here. This happens everytime the user replies to a main comment-->
<?php
$showsubcomments = $pdo->prepare("SELECT * FROM subcomments WHERE idComment = ?");
$showsubcomments->execute(array($idcomment));
while($subcommentslist = $showsubcomments->fetch()){
$subcommenter = $subcommentslist['idComment'];
$selectcomment = $pdo->prepare("SELECT * FROM comments WHERE id = ?");
$selectcomment->execute(array($subcommenter));
$row7 = $selectcomment->fetch();
//This is to get the parent comment user
$selectuser = $pdo->prepare("SELECT * FROM registered_users WHERE id = ?");
$selectuser->execute(array($row7['idUser']));
$row8 = $selectuser->fetch();
$subcommentslist['idUser']; //The user that made the subcomment
$selectuser2 = $pdo->prepare("SELECT * FROM registered_users WHERE id = ?");
$selectuser2->execute(array($subcommentslist['idUser']));
$row9 = $selectuser2->fetch();
?>
<!--SECOND LEVEL LIST ITEM: This is to show the subcomments-->
<li>
<div>
<?php echo "<b>".$row9['username']; ?>
<?php echo "<br>".$subcommentslist['subcomments']."<br>"; ?>
<!--additional subcomment buttons or controllers-->
<?php
if($row9['id'] == $row['id']){ ?> <button>Edit</button><?php }else{ ?> <button>Report</button><?php } ?> <button class="reply">Reply</button><?php if($row9['id'] == $row['id']){ ?> <a onClick="return confirm('You sure you wanna delete that comment there')" href=""><button>Delete</button></a><?php }
?>
</div>
<div class="replyto" style="margin-left:5%; position:relative;">
<!--THIS IS TO REPLY TO BOTH THE MAIN COMMENT AND SUBCOMMENTS BELOW IT-->
<form enctype="multipart/form-data" method="post" action="<?php echo "postsubcomment.php?id=$idcomment"; ?>">
<textarea name="subcomment" cols="50" rows="4"></textarea>
<input type="submit" name="reply" value="Submit">
</form>
</div>
</li>
<?php
}//THIRD (SUBCOMMENTS) WHILE CLOSED
?>
</ul> <!--SECOND UNORDERED LIST CLOSED -->
</li>
<?php
} //SECOND WHILE CLOSED
} //FIRST WHILE CLOSED
?>
好吧,第一个实例(评论)"reply button "行为有效。为什么不是二审(回复子评论)?我想知道问题是第二个还是第三个 while 循环,或者它可能与 "ul" 和 "li" 安排有关。
嗯,这里的老大会为你解决这些问题,伙计。 对于第二个问题(跨度:"view replies"),将您的代码更改为:
$(document).ready(function(){
$(".clicktoviewreplies").click(function(){
//$(this).closest('ul').next('.replies').hide();
//$('.replies').
$('.replies').not($(this).next('.replies')).css("display", "none");
$(this).next('.replies').slideToggle(100);
});
});
并将文本更改为 "show/hide replies"。 对于第一个问题(回复按钮和评论以及"subcomment"表单),删除"style"标签和所有css,属性"display: none"除外。请记住,jQuery 甚至 Javascript 代码可能会出现故障,因为您正在使用超出 class 本身所需的东西来识别代码中的元素。我不知道如何解释为什么会这样。 所以不要使用:
<div class="replyto" style="margin-left:5%; position:relative;">
使用:
<div class="replyto">
而在 CSS 中,仅使用:
.replyto
{
display: none;
}
还有一个提示:为了拥有结构良好且 "understable" 的代码实现方式,您可以避免使用 "style" 标记并仅使用 CSS 在单独的样式表中组织文档。希望对你有所帮助,伙计。