重复 jQuery ajax 调用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5140939/
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
Repeat jQuery ajax call
提问by randomwebdev
How to repeat jQuery ajax call every 10 seconds?
如何每 10 秒重复一次 jQuery ajax 调用?
$(document).ready(function() {
$.ajax({
type: "GET",
url: "newstitle.php",
data: "user=success",
success: function(msg) {
$(msg).appendTo("#edix");
}
});
I've tried to wrap the $.ajax with a function and to call the function with setInterval
我试图用一个函数包装 $.ajax 并用 setInterval 调用该函数
$(document).ready(function() {
function ajaxd() {
$.ajax({
type: "GET",
url: "newstitle.php",
data: "user=success",
success: function(msg) {
$(msg).appendTo("#edix");
}
});
}
setInterval("ajaxd()",10000);
});
But it says "ajaxd is not defined"
但它说“未定义ajaxd”
回答by balexandre
Your method should not be placed inside the readymethod, or it would only beavailable there and not outside.
你的方法不应该放在ready方法中,否则它只能在那里而不是在外面。
$(document).ready(function() {
setInterval(ajaxd, 10000);
});
function ajaxd() {
$.ajax({
type: "GET",
url: "newstitles.php",
data: "user=success",
success: function(msg){
$(msg).appendTo("#edix");
}
});
}
回答by Wiktor Bednarz
Better approach would be to use setTimeout
, so you only make a request when the previous one is done.
更好的方法是使用setTimeout
,因此您仅在前一个完成后才发出请求。
How it should be done
应该怎么做
Imagine that request for some reason (server malfunction, network error) takes longer than defined time. You'll have many simultaneus requests, which isn't any good. And what if you decide to shorten the time difference from 10 seonds to 1 second in the future?
想象一下,由于某种原因(服务器故障、网络错误)的请求花费的时间比定义的时间长。你会有很多同时的请求,这没什么好处。如果您决定将来将时差从 10 秒缩短到 1 秒怎么办?
$(function() {
var storiesInterval = 10 * 1000;
var fetchNews = function() {
console.log('Sending AJAX request...');
$.ajax({
type: "GET",
url: "newstitles.php",
data: {
user: 'success',
some: ['other', 'data']
}
}).done(function(msg) {
$(msg).appendTo("#edix");
console.log('success');
}).fail(function() {
console.log('error');
}).always(function() {
// Schedule the next request after this one completes,
// even after error
console.log('Waiting ' + (storiesInterval / 1000) + ' seconds');
setTimeout(fetchNews, storiesInterval);
});
}
// Fetch news immediately, then every 10 seconds AFTER previous request finishes
fetchNews();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
I know, after 6 years. But still, I thought it's worth for other people.
我知道,6年后。但是,我仍然认为对其他人来说是值得的。
Why the OP's code didn't work?
为什么 OP 的代码不起作用?
It's worth noting that your code didn't work mainly, because you passed your ajaxd()
function call as a string to setInterval
. It's not a good practice, partly because setInterval
will expect the functions to be defined globally. You should use reference to a function, like in my example. That way, it doesn't matter where your function is defined and if it's anonymous or not.
值得注意的是,您的代码主要不起作用,因为您将ajaxd()
函数调用作为字符串传递给setInterval
. 这不是一个好的做法,部分原因是setInterval
期望函数被全局定义。您应该使用对函数的引用,就像在我的示例中一样。这样,您的函数在哪里定义以及是否匿名都无关紧要。
回答by Curt
$(document).ready(function() {
setInterval(function() {
$.ajax({
type: "GET",
url: "newstitle.php",
data: "user=success",
success: function(msg){
$(msg).appendTo("#edix");
}
});
}, 10000);
});