Question

所以我从数据库中提取了一些评论并回显到div。

我正在通过表单输入新的评论，并使用ajax将它们插入到数据库中。

我希望div中的注释能够在发布后立即更新并显示新的注释。

如何在不重新加载页面的情况下刷新div以显示新内容？

javascript就是这样：

      // ... goes after Validation
    if (check == true) {
$.ajax({
type: "POST",
url: "process/addcomment.php",
data: $targetForm.serialize(),
dataType: "json",
success: function(response){

    if (response.databaseSuccess)
       $comment.after('<div class="success">Update Added!</div>');
    else
       $comment.after('<div class="error">Something went wrong!</div>');

}
        });
    }
    return false;
});

}）;

感谢您的帮助。

Answer 1

我想你想用

http://api.jquery.com/prepend/在顶部发表新评论，

OR，

http://api.jquery.com/append在底部发表新评论。

使用后立即

   $comment.after('<div class="success">Update Added!</div>');

只需附加或添加形成评论框的有效结构即可。就像例如：

$("#comment-holder").append("<div class='commentbox'><p class='commenthead'>" + response.newCommentHeadline + "</p><p class='commentcontent'>" + response.newCommentContent + "</p></div>");

另外值得查看 response.databaseSuccess ，您可能希望比较使用“==”更严格地比较它，因为布尔并不总是按预期工作，因为我不确定你的回复文件的格式是否正确，它是否正确解释为布尔。

Answer 2

你应该从响应 json中提取你需要的数据并生成一个Html，用于附加id为“comment”的div，然后当你应用你的css时它会被设置为样式。

我的建议是，如果您不想从服务器向评论添加额外信息，您只需要一个标志作为成功或失败，而不是将数据发送到服务器并检索它，您可以在成功时使用本地数据插入到您的数据库

if (check == true) {
  $.ajax({
     type: "POST",
     url: "process/addcomment.php",
     data: $targetForm.serialize(),
     dataType: "json",
     success: function(response){
            $("#comment").after('<div><div class="from">'+response.from+'</div><div class="message">'+response.message+'</div></div>');
     }
     fail:function(){
            $("#comment").after('<div class="error">Something went wrong!</div>');
     }
});
}

ajax数据库插入后更新div

2 个答案: