Question

我填充的字段是一个如下所示的表：

<table class="history"></table>

jquery-ajax看起来像这样：

<script type="text/javascript">
    $(document).ready(function() 
    {

        function fetchComments()
        {
            $.ajax({
                    type: 'POST',
                    url: '/members/comment/fetch/',
                    dataType: "json",
                    timeout: 100,
                    success: function(data) 
                    {
                        $.each(data, function(i, data){
                             $(".history").append("<tr><td>" + data.member_id + "</td><td>" + data.comment + "</td></tr>");
                        })                          
                    }
            });
        }

        function clear()
        {
            $(".history").html('');
            fetchComments();

        }
        setInterval(clear, 1000);

    });
</script>

获取json（/ members / comment / fetch）的页面如下所示：

[{"member_id":"2","comment":"horses--"},{"member_id":"2","comment":"kkk"},{"member_id":"2","comment":"sarmen22kkkkkkkkkkkkkj"},{"member_id":"2","comment":"sarmen22kkkkkkkkkkkkkj"},{"member_id":"2","comment":"sarmen22kk"},{"member_id":"2","comment":"sarmen22"},{"member_id":"2","comment":"sarmen"},{"member_id":"2","comment":"lklklk"},{"member_id":"1","comment":"this is admin"},{"member_id":"2","comment":"kkk"},{"member_id":"1","comment":"this is admin 2"},{"member_id":"2","comment":"kkk"}]

创建这个json的方法是通过读取mysql中的所有行并输出为json格式。我遇到的问题是setinterval每秒重新请求json，并且填充的表格非常紧张，并且不能平滑地填充数据。我怎么能写它，以便表格顺利填充。这是我正在创建的一个简单的小聊天应用程序。

ps：它也使页面刷新（以某种方式），所以如果有一个长数据表并且我向下滚动，刷新会使页面重新启动。

Answer 1

首先，我不会擦除所有内容并在每次setInterval迭代中重新创建表数据，而只是将新数据附加到表中。

Answer 2

您可以使用几种快捷方式。也许将成功数据存储在变量中，并在重写表之前检查它是否已更改。

ThatSteveGuy的答案是最正确的方法，但是，你可能需要从数据库中返回一个主键来实现它。

var lastData = "";
...
success: function(data) 
{
   if (data != lastData)
   {
     lastData = data;
     $(".history").html('');
     ... (foreach data populate the table)
   }
}

Answer 3

首先，我会使用setTimeout()函数一旦ajax请求加载（有或没有错误），而不是使用setInterval()函数，这不考虑可能的连接问题/延迟。

另外，我会让查询返回每条评论的时间戳，您可以在以后的ajax请求中发送最新的评论，以检索在此时间之后发布的评论。如果您在表格中没有这些数据，我肯定会将其添加为UTC_TIMESTAMP()。这对你的历史也很有用：

有人：嗨，是什么？（2012年10月11日上午6点48分发送）

如果有新的json数据，如何通过ajax检索数据？

3 个答案: