在jquery注释系统中，使用hide()和fadeIn('slow')只添加新注释，而不是全部

Question

我有下面的jquery和php代码，用在一个类似facebook的评论系统中。

用户输入评论，然后发布它。我使用hide()和fadeIn('slow')来使发表的评论看起来很漂亮。我唯一的问题是hide()和fadeIn('slow')适用于所有发表的评论。

我想让它只适用于每次发布的新评论。你知道如何修改我的代码来做到这一点吗？

<script> 
    $(document).ready(function(){                           
    $("#comment_process").click(function(){
        if($("#comment_text").val() != ""){ 
            $.post("comments.php?action=post", { comment: $("#comment_text").val() }, function(data) {
                $(".comments").html(data).hide().fadeIn('slow');
                $("#comment_text").val("");
            });
        } 
    });   
    });   
</script>

<div class="comment_container">
    <div class="comment_form">
        <textarea id="comment_text" placeholder="type..."   style="font-size:11pt;  color:green;  resize:none ">    </textarea>
        <input type="button" id="comment_process" value="Post"/>
    </div>
</div>

<div class="comments">  <?php include_once("comments.php");?>  </div>    

用于存储和检索我的数据库中的注释的comments.php。

Answer 1

我不知道您的评论更新的顺序(Asc或Desc)：

如果你的新评论放在第一位，那么使用

$(".comments:first-child").html(data).hide().fadeIn('slow');
$(".comments").first().html(data).hide().fadeIn('slow');

否则使用

$(".comments:last-child").html(data).hide().fadeIn('slow');

要获得更多易用性，您可以查看这些教程using :first、using .first()

Answer 2

您总是可以为post分配一个data- attribute，然后使用

$('.comments[data-id=xxxxx]').hide().fadeIn();

让它淡出。

你可以分配任意多的数据属性，它们只需要以data-开始，例如data-id，data-name，data-xxxxxx。

分配属性的过程如下所示：

<div class="comments" data-id="xxxxx">

当然，将xxxxx替换为您想要的任何内容，例如new、1、last...

由于您的jquery选择器将选择限制到具有该属性的元素，它只会在您想要的注释中隐藏和淡出，因此数据属性可以用于加载多种用途。