我一直在与这段代码争夺数小时而没有任何进展。有人可以协助我解决这个问题吗? 我正在我的网站上的论坛页面上工作,评论和回复评论功能。 单击每个注释下的“回复”按钮,textarea会动态显示回复。回复将插入到数据库中,并带有回复ID和原始注释ID(回复原始注释时生成的id)。 我现在的挑战是对论坛上任何评论的回复似乎只引用最新评论的id(可能是因为回复表格是动态生成的)。因此,在我的数据库中,他们拥有最新评论的Id。这实际上意味着在获取时,回复将在最新评论下排队。我需要的是一种引用被回复的评论的ID的方式。 这是我的PHP代码:
<?php
require("includes/conn.php");
$stmt=$conn->prepare("SELECT post_id, user, topic, post, time FROM post_tb ORDER BY time DESC");
$stmt->execute();
$result = $stmt->get_result();
$num_of_rows = $result->num_rows;
if ($num_of_rows > 0){
while ($row = $result->fetch_assoc()){
$post_id = $row['post_id'];
$user = $row['user'];
$topic = $row['topic'];
$post = $row['post'];
$time = $row['time'];
$time = date('M dS, Y g:i A', strtotime($time));
echo '<div>
<div>
<h5><strong>'.$user.'</strong></h5><h6>'.$time.'</h6>
<h5><strong>'.ucfirst($topic).'</strong></h5>
<p data-id="'.$post_id.'">'.$post.'</p>
</div>
<div>
<button type="button" class="btn btn-primary rep" id="but_rep" data-id="'.$post_id.'">Reply</button>
</div>
<form id="comment_reply" data-id="'.$post_id.'" method="post" action="">
<input type="text" class="hidden" value="'.$post_id.'" id="post_id">
<input type="text" class="hidden" value="'.$user.'" id="user">
<textarea class="form-control" rows="3" name="post_rep" id="post_rep"></textarea>
<button type="submit" class="btn btn-primary" id="post_rep_sub">Submit</button>
</form>
<div/>';
}
}
?>
我的Ajax / jquery在这里:
$("form#comment_reply").hide();//Comment reply form hidden at page load
//To hide reply button and show the reply form
$(document).on('click', 'button.rep', function(e){
e.preventDefault();
var closestDiv = $(this).closest('div');
var closestForm = $(closestDiv).next('form#comment_reply');
$(closestDiv).fadeOut();
$(closestForm).fadeIn();
});
//To process comment reply
$(document).on("click", "form button#post_rep_sub", function(e){
e.preventDefault();
var reply = $("form textarea#post_rep").val();
var name = $("input#user").val();
var post_id = $("input#post_id").val();
if (reply != ''){
$.post('insert_post_reply.php', {'reply':reply, 'name':name, 'post_id':post_id}, function(data){
if (data = 'yes'){
$("form textarea#post_rep").val("");
fetchCommentReply();
}
});
}else{
return false;
}
});
答案 0 :(得分:0)
我认为问题出在点击处理程序&#34;表单按钮#post_rep_sub&#34; 。
您使用以下语句阅读post_id:var post_id = $("input#post_id").val();
但无论按哪个按钮,这总是会返回最后一个post_id。
要验证我的观点,您可以添加此内容并观察javascript-console:
var test1 = $("input#post_id");
var test2 = $("input#post_id").length;
console.log(test2);
如果您看到数字&gt; 1,那么您就知道要修复点击处理程序&#34;表单按钮#post_rep_sub&#34; 。
答案 1 :(得分:0)
主要问题是你的php代码使用相同的id多次生成html元素(例如按钮)!然后jquery只将自己附加到第一个按钮。 这已经用一个例子来解释:
How jQuery works when there are multiple elements with the same "id"?
解决方案:用name-attribute替换id!
根据HTML规范,id属性必须在页面上是唯一的(它不是网页设计师/开发人员刚刚发明的标准)
让我们仔细看看你的php产生了什么。您有多个具有相同ID的元素,例如id =&#34; but_rep&#34;多次生成。请注意,您只能在html文件中使用ID 一次! 因此,您不能假设jquery使用id可靠地附加事件处理程序!
<div>
<div>
<h5><strong>user 1</strong></h5><h6>'.$time.'</h6>
<h5><strong>topic 1</strong></h5>
<p data-id="101">post text1</p>
</div>
<div>
<button type="button" class="btxtn btn-primary rep" id="but_rep" data-id="101">Reply</button>
</div>
<form id="comment_reply" data-id="101" method="post" action="">
<input type="text" class="hidden" value="101" id="post_id">
<input type="text" class="hidden" value="user 1" id="user">
<textarea class="form-control" rows="3" name="post_rep" id="post_rep"></textarea>
<button type="submit" class="btn btn-primary" id="post_rep_sub">Submit</button>
</form>
<div/>
<div>
<div>
<h5><strong>user 2</strong></h5><h6>'.$time.'</h6>
<h5><strong>topic 2</strong></h5>
<p data-id="102">post text2</p>
</div>
<div>
<button type="button" class="btxtn btn-primary rep" id="but_rep" data-id="102">Reply</button>
</div>
<form id="comment_reply" data-id="102" method="post" action="">
<input type="text" class="hidden" value="102" id="post_id">
<input type="text" class="hidden" value="user 2" id="user">
<textarea class="form-control" rows="3" name="post_rep" id="post_rep"></textarea>
<button type="submit" class="btn btn-primary" id="post_rep_sub">Submit</button>
</form>
<div/>