Javascript 仅使用jQuery请求显示PHP数组的新内容
我正在改进我的聊天脚本，使用jQuery显示和自动滚动消息。它已经很好地工作了，但是我想在用JSON对象的更新内容替换“div”时消除“刷新”效果，JSON对象是从包含每个jQuery请求的消息的PHP数组中编码的 我怎样才能做到这一点 这就是现在对我有效的方法：Javascript 仅使用jQuery请求显示PHP数组的新内容,javascript,php,jquery,Javascript,Php,Jquery,我正在改进我的聊天脚本，使用jQuery显示和自动滚动消息。它已经很好地工作了，但是我想在用JSON对象的更新内容替换“div”时消除“刷新”效果，JSON对象是从包含每个jQuery请求的消息的PHP数组中编码的 我怎样才能做到这一点 这就是现在对我有效的方法： <head> <script> $(document).ready(function(){ $.ajaxSetup({cache:false}); $("a").click(
<head>
<script>
$(document).ready(function(){
$.ajaxSetup({cache:false});
$("a").click(function(){
$("div").empty(); // removing this will get rid of the 'refresh' effect, but it endlessly appends the message log
$.getJSON('ajax.php', function(data){
$.each(data, function(i, field){
$("div").append(field + "<br>");
});
$(document).scrollTop($(document).height());
});
});
});
window.onload = function() {
document.getElementsByClassName("refreshB")[0].click();
};
var intervalID = window.setInterval(refresh, 10000);
function refresh() {
document.getElementsByClassName("refreshB")[0].click();
}
</script>
</head>
<body>
<a class="refreshB"></a>
<div></div>
</body>
$（文档）.ready（函数（）{
$.ajaxSetup（{cache:false}）；
$（“a”）。单击（函数（）{
$（“div”）.empty（）；//删除此选项将消除“刷新”效果，但它会无休止地追加消息日志
$.getJSON（'ajax.php'，函数（数据）{
$.each（数据、函数（i、字段）{
$（“div”）。追加（字段+”
”；
});
$（文档）.scrollTop（$（文档）.height（））；
});
});
});
window.onload=函数（）{
document.getElementsByCassName（“refreshB”）[0]。单击（）；
};
var intervalID=window.setInterval（刷新，10000）；
函数刷新（）{
document.getElementsByCassName（“refreshB”）[0]。单击（）；
}
readed$（“div”）.empty（）
首先，您必须只从db中获取新行
将新列添加到表中（例如，readed
），然后每次更新此列以了解哪些数据是新的
您不需要这个$（“div”）.empty（）我没有看到PHP代码，我假设您每次都在检索完整的对话？我建议按时间分割条目，只获取新条目。。但这意味着改变代码的实质部分。另一种选择是比较，这将使您的代码更加缓慢您的PHP将不得不决定哪些是需要发送到浏览器的“新”内容。按照目前的设计，你的JS不知道什么是旧的，什么是新的；它只需将聊天窗口中的所有内容替换为PHP发送的任何内容闻起来像是家庭作业分配只需将$（'div'）.empty（）移动到xhr成功回调，这就消除了请求和响应之间的时间间隔，看起来就像是一个即时的重新绘制。看不到PHP代码。我假设您每次都在检索完整的对话？我建议按时间分割条目，只获取新条目。。但这意味着改变代码的实质部分。另一种选择是比较，这将使您的代码更加缓慢您的PHP将不得不决定哪些是需要发送到浏览器的“新”内容。按照目前的设计，你的JS不知道什么是旧的，什么是新的；它只需将聊天窗口中的所有内容替换为PHP发送的任何内容闻起来像是家庭作业分配只需将$（'div'）.empty（）
移动到xhr成功回调，这消除了请求和响应之间的时间，看起来就像是一个即时重新绘制