jQuery：自动刷新`<div>`答案

【问题标题】：jQuery: Auto-Refreshing a `<div>`jQuery：自动刷新`<div>`
【发布时间】：2009-02-25 16:02:08
【问题描述】：

我无法让这个<div> 使用 jQuery 自动更新。它本质上是一个聊天功能，每两秒刷新一次页面。我已经尝试了几种变体，但都没有运气，所以完全改写它是非常受欢迎的。

jQuery 代码：

function updateChat() {
    $.get("chat_data.php", function(data) {
        $("div#chattable").html(data);
    });

    window.setTimeout("updateChat();", 2000);
}

$(document).ready(function() {
    updateChat();
});

这是<div> 代码，它从chat_data.php 获取数据。这应该是更新：

<div id="chattable">
    <?php include("js/chat_data.php"); ?>
</div>

chat_data.php：

<?php foreach($query->result() as $row):
    echo "<div class='chatrow'>";
    echo "<div class='chattime'>".date("[M.d] g:ia",strtotime($row->time))."</div>";
    echo "<div class='chatnamematch'>[".$row->name."]</div>";
    echo "<div class='chatbody'>".$row->body."</div>";
    echo "</div>";
endforeach; ?>

【问题讨论】：

当您尝试运行此代码时会发生什么？你看过萤火虫的输出吗？
应该查看stackoverflow.com/questions/220767/… 的解决方案，以了解更好的方法来执行 jquery 回调（更稳健地处理超时/失败）

标签： php jquery codeigniter

【解决方案1】：

您得到的Call to a member function result() on a non-object in /var/www/js/chat_data.php on line 1 错误意味着变量$query 未正确设置。您说您使用的是 CodeIgniter，是这样，文件ajax_data.php 位于哪个文件夹中？应用程序/控制器？

【讨论】：

我把它完全放在一个单独的区域。它现在正确引用了文件，但是 codeigniter 在生成它时遇到了问题（可能是因为控制器将数据发送到视图，然后视图从附加的 .php 文件（chat_data.php）中请求该数据。
我建议您将代码从 chat_data.php 移动到它自己的文件（在应用程序/控制器中）。由于 codeigniter 的设计方式，从视图中包含文件效果不佳。也查看文件没有得到我相信的 $db 对象
另外，记得在 $row->name/body 上调用 htmlspecialchars()，否则聊天者可能会开始说诸如或互相...
俄罗斯恶意软件其实很有用

【解决方案2】：

一切看起来都应该有效。 $.get 中的 URL 需要是“js/chat_data.php”而不是“chat_data.php”吗？

另外，我会将 php 包含从 div 中取出，因为无论如何它都会通过 AJAX 加载。

【讨论】：

不幸的是，如果我不包含它，它不会加载，所以 jquery 一定不能正确地到达它。这是当我在 jquery 中放入“js/chat_data.php”时它向我抛出的错误：致命错误：在 /var/www/js/chat_data.php 中的非对象上调用成员函数 result() 1
是的，现在让 codeigniter 正确推送信息是个问题，谢谢。

【解决方案3】：

一些想法和一个替代代码示例。很难说你的问题出在哪里，所以这些只是一些想法。

您可以将等待转移到您的 PHP，而不是使用 javascript 计时器重新执行

尝试使用更简单的 jQuery.load() 方法。

function updateChat() {

 $("#chattable").load("chat_data.php", function() { updateChat(); });

}

在 PHP 方面，

  sleep(2); // sleep for two seconds before returning output

效果类似，但简化了一点。在返回输出之前不会调用 updateChat() 函数。

嗯，只是一个想法。不确定它是否是正确的解决方案，但它可以帮助您隔离问题（取出 js 计时器变量）。

【讨论】：

谢谢，这个 jquery 代码实际上是可以工作的，只是现在让数据正确显示。
太好了 - 我认为这种方法可能会简化，至少在最初是这样。