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

您始终可以为帖子分配数据属性，然后使用

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

淡出它。

您可以根据需要分配任意数量的数据属性，只需从数据开始，例如data-id，data-name，data-xxxxxx。

分配属性的方式如下：

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

用你想要的任何东西替换xxxxx，例如新的，1，最后......

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

在jquery评论系统中，使用hide（）和fadeIn（＆＃39; slow＆＃39;）仅用于新评论而不是全部评论

2 个答案: