I am trying a JavaScript function after 10 second of body load. But it is showing immediatly after body load. I am not expert in JavaScript, so I am not able to find where is the problem. my code is below:
<script type="text/javascript">
window.onload=setInterval(div_show(), 10);
</script>
<script>
window.onload = function(){
//time is set in milliseconds
setTimeout(div_show, 10000)
};
</script>
You need to:
Assign a function to onload. setInterval returns an interval id, not a function
Pass a function to setInterval, div_show() will call the div_show function and pass its return value
Multiple your number of seconds by 1000. setInterval's second argument is accepts a number of milliseconds not seconds.
Such:
onload = function () {
setInterval(div_show, 10 * 1000);
}
Finally, if you want to run the function 10 seconds after the document loads, rather than every 10 seconds starting from when the document loads, use setTimeout instead of setInterval.
Wrap it inside a function.
<script type="text/javascript">
window.onload = function(){
setInterval(div_show, 10);
}
</script>
Also, if you're sure if you want to execute this function only once when the body loads, you might as well want to use setTimeout instead of setInterval. Like
<script type="text/javascript">
window.onload = function(){
setTimeout(div_show, 10);
}
</script>
If you want 10 it to execute after 10 seconds, you need to set the timer parameter to number of seconds * 1000
In your case, 10*1000
Either
setTimeout(div_show, 10*1000);
or
setTimeout(div_show, 10000);
This code will work. Just set your time in milliseconds and write your JS code on loadAfterTime function:
<script>
window.onload = function(){
setTimeout(loadAfterTime, 1000)
};
function loadAfterTime() {
// code you need to execute goes here.
}
</script>
Related
<body onload="startTime('<%= time %>')">
</body>
<script>
setTimeout(function startTime(time) {
alert(time);
}, 1000)
</script>
I have returned the "time" from the client side by input from another page. Then, the "startTime()" will be called each seconds, in which the "time" parameter will be given to the function.
How can I pass the "time" variable in the <script> in every seconds under the onload function.
For running it every second, you have to use setInterval instead of setTimeout.
You should introduce your startTime outside of setInterval.
Your '<%= time %>' should not be a string too, it should be like this <body onload="startTime(<%= time %>)">.
<body onload="startTime(1000)">
</body>
<script>
function startTime(time) {
setInterval(function() {
alert(time);
}, time)
}
</script>
If time is a string you need to parse your time to a number.
<body onload="startTime('1000')">
</body>
<script>
function startTime(time) {
setInterval(function() {
alert(time);
}, Number(time)) //parse time string to a number
}
</script>
Though your question isn't much clear, maybe you can use $('document').ready(function(){});
inside your script if you use jQuery.
Also if you don't want to use jQuery another approach might be self executing anonymous function like this
<script>
(function(time) {
//this function will we invoked immediately
console.log(time);
})("Pass params here");
</script>
setTimeout will run the function after the timer (in your case 1000ms) has run out. If you want it to continuously run every N seconds, you need to use setInterval instead.
MDN: https://developer.mozilla.org/en-US/docs/Web/API/setInterval
You can pass arguments to the callback function, by passing a 3rd (or more) argument to the setInterval. But it won't be updated, you need to build your own code around it, so you get the updated value.
What you have in your code right now will not work. You don't call the callback function directly. setTimeout starts immediately after the page loads. Your startTime function is anonymous, and is essentially this:
setTimeout((time) => {
alert(time);
}, 1000)
// alert will be run after 1 second on page load
Another recommendation is, to not run code from HTML strings. Keep JavaScript related code inside of JavaScript. You can query HTML Elements inside of JavaScript and depending on if they changed, you can start running the code.
I am trying to create a pop-up that automatically appears after a delay. is this possible through javascript? if so how would I implement this into my code?
Here is a link to the code I am working on https://jsfiddle.net/hk2808/7cs4xdmg/
function openPopup() {
window.location.hash = 'openModal';
}
window.onload = openPopup;
You can use setTimeout. I would make a more generic function that runs on onload and simply call openPopup from there.
Try this:
function openPopup() {
window.location.hash = 'openModal';
}
function onPageLoad() {
setTimeout(() => {
openPopup()
}, 3000)
}
window.onload = onPageLoad;
The popup will load 3 seconds after the onload for example.
setTimeout will do what you are looking to do
https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout
No, there isn't a way to delay the window onload. You could try to add a lot of images and other things that take a long time to load, but that's not an ideal solution. Instead, you can use setTimeout to make code run after a period of time.
setTimeout(function(){
window.location.hash = 'openModal';
//or whatever else you want to happen after 1 second
},1000);
//the 1000 means after 1000 miliseconds, or after 1 second.
Hope this helps!
<script>
var refresh;
function refresh(timeoutPeriod){
refresh = setTimeout(function(){window.location.reload(true);},timeoutPeriod);
}
makeClientRequest('live','liveFeed','');
window.onload=refresh(5000);
<script>
I want to call this function every 5 sec. I try that way.but it didn't work.
Try setInterval instead of setTimeout
refresh = setInterval(function(){window.location.reload(true);},timeoutPeriod);
setTimeout will call the function only once after the specified time period. But setInterval will call the function on specified interval of time
Is there a way to repeat a function in Javascript using the setTimeout function? For example, I need two functions to be called every five seconds. I have something like this:
$(document).ready(function(){
setTimeout('shiftLeft(); showProducts();', 5000);
});
but it only happens once, five seconds after page loads, and I need it to happen every five seconds.
Use setInterval() instead of setTimeout(), if you want your function to be executed repeatedly. setTimeout() delays the execution of your function for x seconds, while setInterval() executes your function every x seconds.
Both within the boundaries of the event queue of JavaScript, so don't be too confident, that you functions get executed at the exact time you specified
$(document).ready(function(){
setInterval( function(){ shiftLeft(); showProducts(); }, 5000);
});
Every x seconds can be done with setInterval:
$(document).ready(function(){
setInterval(function(){
shiftLeft(); showProducts();
}, 5000);
});
$(document).ready(function(){
setTimeout(function(){
shiftLeft(); showProducts();
}, 5000);
});
I've done this a month before...
But now its not working...
The code is
window.onload = function(){
setTimeout(function(){
alert("Hello");
}, 10000);
};
This is written in script in head of the test.php page.
The script and other tags are correct.
I would like to call a specific function every 10 seconds. The alert just shows once only. This is problem in every browser....
After this testing i would like to check the url every 2 seconds and call an AJAX function.
Any Help??
That's what setTimeout does (executes once after a specified interval). You're looking for setInterval (calls a function repeatedly, with a fixed time delay between each call to that function):
window.onload = function(){
setInterval(function(){
alert("Hello");
}, 10000);
};
Use setInterval instead.
var fn = function(){alert("Hello")};
It is possible using setTimeout:
window.onload = function(){ setTimeout( function(){ fn();window.onload() },10000) };
but the best solution is setInterval:
window.onload = function() { setInterval(fn,10000)};
setTimeout is intended for one-time run. Look at setInterval function.