javascript 仅自动刷新 jquery 中页面的特定 <div> 元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24589258/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
automatic refresh of only specific <div> element of a page in jquery
提问by Anshuman Singh
How to refresh content of particular element instead of whole page, after some interval using Jquery?
使用Jquery一段时间后，如何刷新特定元素而不是整个页面的内容？
When I used code shown below, its only appending same data several times after defined time duration, but I don't want this, I want only that data should be append if any new data inserted by user in mysql.
当我使用下面显示的代码时，它只在定义的持续时间后多次附加相同的数据，但我不想要这个，我只想在用户在 mysql 中插入任何新数据时附加该数据。
setInterval(function(){
$.ajax({
url:"confess_show.php",
type:"GET",
dataType:"html",
success:function(data){
$('.content').append(data);
}
});
}, 6000);
回答by DWX
Try using this:-
尝试使用这个：-
JS
JS
$(document).ready(function() {
var refreshId = setInterval(function() {
$("#responsecontainer").load('response.php');
//OR THIS WAY : $("#responsecontainer").load('response.php?randval='+ Math.random());
}, 5000);
$.ajaxSetup({ cache: false });
});
HTML
HTML
<div id="responsecontainer"></div>
Create a file "response.php" and add php script there, it'll load that php code after every 5seconds(5000 = 5seconds)
创建一个文件“response.php”并在那里添加 php 脚本，它会在每 5 秒（5000 = 5 秒）后加载该 php 代码
回答by Trolley
I would use a timestamp, as it doesn't need to get latest insert id of every update.
我会使用时间戳，因为它不需要获取每次更新的最新插入 ID。
var timestamp = 0;
setInterval(function(){
$.ajax({
url:"confess_show.php?t=" + timestamp,
type:"GET",
dataType:"html",
success:function(data){
if(data != ''){ //Only append data if there are some new
timestamp = Math.round((new Date()).getTime() / 1000); //Set timestamp to current time
$('.content').append(data);
}
}
});
}, 6000);
confess_show.php should then only fetch rows with a timestamp larger than $_GET['t']. That way, you don't need to keep track of the latest id shown.
confess_show.php 应该只获取时间戳大于 $_GET['t'] 的行。这样，您就不需要跟踪显示的最新 ID。
回答by John C
change the line:
更改行：
$('.content').append(data);
to
到
$('.content').html(data);
回答by Alfred Huang
I think you might want append, but NOT replace.
我想你可能想要append，但不是replace。
So if in this case, you should remember where you go off.
所以如果在这种情况下，你应该记住你去哪里。
I just make an example:
我只是举个例子：
// remember the last id fetched.
var last_id = 0;
setInterval(function(){
$.ajax({
// here, send the last_id, and only fetch data newer than that.
url: "confess_show.php?newer_than="+last_id,
type: "GET",
dataType: "html",
success: function(data){
// also, here, after data was fetched, update the last_id with the latest one.
last_id = getLastId(data);
$('.content').append(data);
}
});
}, 6000);
回答by Lewis
May be something like:
可能是这样的：
setInterval(function(){
$.ajax({
url:"confess_show.php",
type:"GET",
dataType:"html",
success:function(data){
if($('#yourDataWrapperId').length == 0){ //check if data exist
$('.content').append(data);
}
}
});
}, 6000);
