Question

基本上，我有一个评论系统，我正在尝试添加AJAX / jQuery支持，以便用户可以查看“回复”评论，类似于Youtube处理评论和回复的方式。

显示与文章相关的每条评论（comment_view.php），如果是对其他评论的回复，则会显示一个按钮，用户可以单击该按钮查看其回复的评论。

初始评论显示正常，然后当点击“回复”按钮时，回复按预期显示！但是，当刚刚返回的回复中单击下一个“回复”按钮时，没有任何反应。

另一个奇怪的事情是，如果我摆脱了回复div上的style="display: none;"，它似乎可以正常工作，并将所有“回复”全部拉过来，尽管没有jQuery“show”动画。

对这里发生了什么的任何想法？

总共涉及3个文件：article.php，comment_view.php和getreply.php，详情如下：

article.php（摘录）

此文件命中数据库并提取文章及其相关评论

foreach ($comments as $comment) {
    echo '<div id="comment'.$comment['id'].'" class="comment">';
    require 'comment_view.php';
    echo '</div>';
}

comment_view.php

这个文件包含在article.php（上面）和getreply.php中（下面是使用下面的JavaScript中的AJAX获取的）

$_SESSION['rnum']++; //session variable that gets incremented to make sure each reply div id is unique

if ($comment['reply_to_id'] != null) {
    echo '<div id="reply'.$_SESSION['rnum'].'" style="display: none;"></div>'; //empty/hidden div to hold the future contents of a reply, which ends up being this file, instantiated by getreply.php (below) with a new $comment from database
}

echo '<div class="content">';
echo nl2br($comment['content']);
if ($comment['reply_to_id'] != null) {
    echo '<br/><button id="showreply'.$_SESSION['rnum'].'" onclick="showReply('.$comment['reply_to_id'].','.$_SESSION['rnum'].'); this.disabled = true;">In reply to -> '.$comment['reply_to_id'].'</button>';
    echo '<script>$("#showreply'.$_SESSION['rnum'].'").click(function () { $("#reply'.$_SESSION['rnum'].'").show("slow"); });</script>';
}
echo '</div>'; //content

JavaScript（位于article.php标题中）

这个AJAX函数接受comid（注释ID）并将其传递给getreply.php，以便它知道从数据库中提取哪个回复。它还需要rnum来确定用于替换。的内容的回复div的唯一ID。

<script>
function showReply(comid,rnum) {
    if (comid=="") {
        document.getElementById("reply"+rnum).innerHTML="";
        return;
    } 
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {

            document.getElementById("reply"+rnum).innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getreply.php?id="+comid,true);
    xmlhttp.send();
}
</script>

getreply.php

此文件采用AJAX传递的comid（注释ID）从数据库中提取回复注释，然后重新调用comment_view.php（然后应为下一个可能的回复生成另一个新的唯一rnum，并吐出注释）

session_start();

$query = "SELECT * FROM comments WHERE id = ".$_GET['id'];
$result = $mysqli->query($query) or die($mysqli->error. " [" . __LINE__ . "]");

if ($result->num_rows == 1) {
    $comment = $result->fetch_assoc();
    require 'comment_view.php';
}

这比我预期的要长一些，但要提前感谢任何帮助或想法......

Answer 1

根据要求，以答案形式^^

您需要删除添加到每个回复的.click脚本，而是将$("#reply"+rnum).show("slow");放在代码中document.getElementById("reply"+rnum).innerHTML=xmlhttp.responseText;之后。发生这种情况的原因是，有两个click事件与按钮相关联，并且它们相互冲突。此外，在收到回复之后将其设置为良好做法，为什么.show会显示某些内容，而不是在获得回复之前显示空div。

Answer 2

在您使用的第一个代码段中

require 'comment_view.php';

这适用于单个评论。只要您有第二条评论，它就会抛出错误，因为已经需要comment_view.php。将其更改为

require_once 'comment_view.php';

并查看它现在是否有效。

在第一次回复被拉出后，PHP + AJAX + jQuery评论/回复系统停止工作

2 个答案: