This question already has answers here:
Why is my function call that should be scheduled by setTimeout executed immediately? [duplicate]
(3 answers)
Closed 8 years ago.
In my code i need to poll a url after every 5 seconds using ajax . The URL returns a json response. Below is the code that i wrote inside $(document).ready to do this. But,the setTimeout() function does not work. The startPoll() function is called immediately after the response is received.I want to halt for 5 seconds after response is received before calling the startPoll function again . Any way to fix this ?
$(document).ready(function(){
var startPoll = function() {
$.post('<url>', {},onPollRequestComplete, 'json');
}
var onPollRequestComplete = function(response) {
responseObject = eval(response);
if(responseObject.success) {
//Do something here
}
setTimeout(startPoll(),5000); /*Make next polling request after 5 seconds*/
}
startPoll();
});
Thank You
This is your problem:
setTimeout(startPoll(),5000);
You're calling startPoll immediately, not after 5 seconds. Instead, you should pass in the function reference, like so:
setTimeout(startPoll,5000);
If you want the polling to fire every 5 seconds even if previous polls didn't work (a server error was encountered), you should use setInterval instead. The code you have now is great if you want to be able to stop polling in case of errors.
I think rather than setTimeout you need to use setInterval
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var startPoll = function() {
$.post('url', {}, function(response) {
var responseObject = eval(response);
if (responseObject.success) {
alert('hi');
}
}, 'json');
}
setInterval(startPoll, 5000); /*Make next polling request after 5 seconds*/
});
</script>
</head>
<body>
</body>
</html>
Related
This question already has answers here:
What's the easiest way to call a function every 5 seconds in jQuery? [duplicate]
(7 answers)
Closed 8 years ago.
How do I get this javascript to run every second?
source code:
<script type="text/javascript">
$(function() {
//More Button
$('.more').live("click",function() {
var ID = $(this).attr("id");
if(ID) {
$("#more"+ID).html('<img src="moreajax.gif" />');
$.ajax({
type: "POST",
url: "ajax_more.php",
data: "lastmsg="+ ID,
cache: false,
success: function(html){
$("ol#updates").prepend(html);
$("#more"+ID).remove();
}
});
} else {
$(".morebox").html('no posts to display');
}
return false;
});
});
</script>
Use setInterval() to run a piece of code every x milliseconds.
You can wrap the code you want to run every second in a function called runFunction.
So it would be:
var t=setInterval(runFunction,1000);
And to stop it, you can run:
clearInterval(t);
Use setInterval:
$(function(){
setInterval(oneSecondFunction, 1000);
});
function oneSecondFunction() {
// stuff you want to do every second
}
Here's an article on the difference between setTimeout and setInterval. Both will provide the functionality you need, they just require different implementations.
You can use setTimeout to run the function/command once or setInterval to run the function/command at specified intervals.
var a = setTimeout("alert('run just one time')",500);
var b = setInterval("alert('run each 3 seconds')",3000);
//To abort the interval you can use this:
clearInterval(b);
window.setTimeout(func,1000);
This will run func after 1000 milliseconds. So at the end of func you can call window.setTimeout again to go in a loop of 1 sec. You just need to define a terminate condition.
Reference
You can use setInterval:
var timer = setInterval( myFunction, 1000);
Just declare your function as myFunction or some other name, and then don't bind it to $('.more')'s live event.
Use setInterval(func, delay) to run the func every delay milliseconds.
setTimeout() runs your function once after delay milliseconds -- it does not run it repeatedly. A common strategy is to run your code with setTimeout and call setTimeout again at the end of your code.
This question already has answers here:
JavaScript: How to get setInterval() to start now? [duplicate]
(3 answers)
Closed 6 years ago.
I am keeping a live track on no. of users in my system, for that I am using javascript's setInterval() function, following is the code:
function fetchdis() {
$.ajax({
url: "/count/dist",
dataType: "json"
}).success(function(data){
$('#val_dis').html(JSON.stringify(data.sum));
});
}
setInterval(function () {fetchdis()}, 3000);
everything is working properly except I am getting a delay of 3 seconds also first time when I am loading the data(resulting into an empty space), I do not want that interval the first time the data loads.
Thank you for your help
That's because setInterval executes the callback every 3 seconds, and you haven't called the function anywhere else.
function fetchdis() {
$.ajax({
url: "/count/dist",
dataType: "json"
}).success(function(data){
$('#val_dis').html(JSON.stringify(data.sum));
});
}
fetchdis();
setInterval(function () {
fetchdis();
}, 3000);
Notice that I'm calling fetchdis() right before I register the interval.
I have a live updating div on my website. It works fine however the user always have to wait 5 seconds before it loads. Heres my code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$.ajaxSetup({ cache: false });
setInterval(function() {
$('#div-id').load('/something.php');
}, 5000);
});
</script>
Is there a way I can load, it then wait 5 seconds and load it again? Instead of wait 5 seconds, load it, then wait again...
Thanks
Yes. jQuery's load() method has a complete callback function as a parameter:
.load( url [, data ] [, complete ] )
completeA callback function that is executed when the request completes.
Thanks to this we can create a recursive function which calls itself once complete (or in this case, after 5 seconds):
function loadContent(selector, path) {
$(selector).load(path, function() {
setTimeout( loadContent(selector, path), 5000 );
});
}
loadContent('#div-id', '/something.php');
What I've done here is move your content loading logic into a new function called loadContent, which accepts a selector and a path as its parameters. This function then triggers load() on the passed in selector, loading the passed in path. When the content has loaded a setTimeout function kicks in to trigger our loadContent function once again after 5000 millisecond (5 seconds).
Triggering loadContent() to begin with will fire our function off immediately, meaning you will not have to wait 5 seconds before the content first loads.
You have to run your ajax manually before first interval run.
<script type="text/javascript">
var loadContent = function() {
$('#div-id').load('/something.php');
};
$(document).ready(function() {
$.ajaxSetup({ cache: false });
loadContent();
setInterval(loadContent, 5000);
});
</script>
Just call the load once before
$('#div-id').load('/something.php');
setInterval(function() {
$('#div-id').load('/something.php');
}, 5000);
This question already has answers here:
how to kill a setTimeout() function
(5 answers)
Stop scheduled JavaScript execution
(4 answers)
Closed 9 years ago.
The title may be misleading, but it's essentially what I need to accomplish.
I have an AJAX "Loading" text that I want to update if the server has taken more than 15 seconds to respond.
Here is the code:
$(".loader").html('Loading');
$(".loader").show();
setTimeout(function () {
if ($('.loader').is(":visible")) {
$(".loader").html('Click here to reload.</span>');
}
}, 15000);
Is there a better approach? When I eventually call $(".loader").hide(); I want the setTimeout counter to be aborted. Is it possible?
Sure. setTimeout returns a value you can pass to clearTimeout in order to stop timeout.
var handle = setTimeout(function () {
alert("Oh noes, I ran!")
}, 5000)
clearTimeout(handle)
You can use the clearTimeout function:
$(".loader").html('Loading');
$(".loader").show();
var timerId= setTimeout(function () {
if ($('.loader').is(":visible")) {
$(".loader").html('Click here to reload.</span>');
}
}, 15000);
$(".stop").click(function () {
clearTimeout(timerId);
$(".loader").html("done");
});
See this fiddle: http://jsfiddle.net/KaNUP/
I would recommend to make a shorter period (1 sec) and increment counter inside function you call. Then you can exit on successfull load or counter threshold, whichever comes earlier.
This question already has answers here:
Why is my function call that should be scheduled by setTimeout executed immediately? [duplicate]
(3 answers)
Closed 7 years ago.
I wanted a JavaScript function to run 60 seconds after page is loaded.
After a little research I have made, I've found that setTimeout() is the solution.
So that's what I did:
<body onLoad="setTimeout(postAction('news.reads', 'article'), 60000);">
Somehow, setTimeout does not work. After the page is loaded, there's no need to wait 60 seconds because postAction() runs immediately.
Why is it happening? How to solve it? Are there alternatives to setTimeout() up there?
Thank you!
You need to wrap postAction in a function to defer execution:
setTimeout(function() { postAction('news.reads', 'article'); }, 60000);
You are actually executing postAction immediately, your code is equivalent to:
var result = postAction('news.reads', 'article');
setTimeout(result, 60000);
The correct way to do what you want in JS, ie setting a timeout after the page is loaded:
(function(w)
{
var load = function()
{
setTimeout(postAction,60000);
if (w.removeEventListener)
{//remove listeners, to avoid leak...
return w.removeEventListener('load',load,false);
}
return w.attachEvent('onload',load);
};
if (w.addEventListener)
{
return w.addEventListener('load',load,false);
}
return w.attachEvent('onload',load);
}(this));
Instead of window.onload = function(){setTimeout(postAction,60000);};, which will work, too, but cause a mem-leak in IE <9. That's just for completeness' sake
Anyway, the key line here is setTimeout(postAction,60000);
Update
After seeing the code you're using, this is the easiest fix:
<body onLoad="setTimeout(function(){ return postAction('news.reads', 'article');}, 60000);">
Are you using setTimeout like :
setTimeout(function(){alert("OK");}, 1000 * 60); // alert "OK" in 60s
<script>
function doSomeJavascript() {
// javascript code goes here
alert('5 secs is up!');
}
// calls function doSomeJavascript() 5 secs after page load
var interval = setInterval(doSomeJavascript, 5000);
setTimeout(function() {
window.clearInterval(interval);
}, 5000);
</script>