I want to make a value on an HTML page that will be updated every 5 seconds so as to not overwhelm the server. It turns out that setTimeout() inside my function is not delaying properly, but is instead being called immediately. Can someone help me find a clue? I really don't want to give my server too much work because I have to implement a lot more AJAX.
Here's the code:
window.onload = function GetUsersNumber() {
aside = document.getElementById("users");
if (XMLHttpRequest) var x = new XMLHttpRequest();
else var x = new ActiveXObject("Microsoft.XMLHTTP");
x.open("GET", "users_count.php", true);
x.send();
x.onreadystatechange = function () {
if (x.readyState == 4) {
if (x.status == 200) aside.innerHTML = x.responseText;
setTimeout(GetUsersNumber(), 50000);
}
}
}
A function object in JavaScript is one thing. A function call is a different thing. You're using the latter, by including parentheses after the function name*, but you need the former, without parentheses. This allows setTimeout to later invoke the function itself by using the passed-in object. Assuming you do actually want 5 seconds (rather than the 50 seconds the original code was using):
setTimeout(GetUsersNumber, 5000);
*Really, any old variable that holds a function object can be invoked like that, but for convenience, defining a function also defines a variable name for it.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With