I want to load this script after loading the page so I want to set a delay for this code to work -
document.getElementsByClassName("pdp-button_theme_bluedaraz")[0].click();
If by "delay" you mean a timer and a function which is called after the timer finishes you might want to use setTimeout() function. argument 1 is the function to be called and argument 2 is the countdown time in milliseonds eg:
setTimeout(exec, 2000);
function exec() {
document.getElementsByClassName("pdp-button_theme_bluedaraz")[0].click();
}
or if you mean execute the script after page has loaded try this
document.onload = function() {
document.getElementsByClassName("pdp-button_theme_bluedaraz")[0].click();
}
Related
Hey i am creating a DOM javascript library and i found myself having the following problem:
For example, if i take a function lets say function update() how can i check if this function has been created on another file; If it has been created on another file how can I make it run once or every couple of seconds without the user need to do this?
For example in the library p5.js :
//If this function has created on this file it will run every one second
function update(){
}
&&
//if this function has created on this file it will call itself once the page is loaded
function start(){
}
*Edit: tried to be more clear on my question thank you for your answers!
Instead of the user needing to call setInterval() to repeat update(), it can call it itself.
function update() {
setInterval(function() {
// do something
}, 1000);
}
All the actual work that needs to be done goes where // do something is.
setTimeout(func, 1000) will call func 1000 milliseconds later.
If you wanted your function to call immediately, you could do a recursion (bad way, better use a loop, but it's useful to illustrate the next example):
// calls itself infinitely, without any delay
function update(){
update(); // Will cause a stack overflow, infinitely deep recursion
}
Now you can make use of setTimeout and tell update to run a second later.
// calls itself infinitely, 1 second delay between calls
function update(){
setTimeout(update, 1000);
}
There is no recursion here. Instead, you defer the call to update() for one second. The second time update() is called, another setTimeout will be called, and so on infinitely.
The second part of your question:
//call itself once the page is loaded
function start(){
}
You can set an event listener to when the page is loaded, and call that function:
window.addEventListener('load', start);
Do this right after defining start().
To reflect your comment:
If you want to detect if the global function update has been defined (by the user, probably) and want to start calling it automatically on equal intervals of 1 second, you'll need to check its existance with typeof and then apply setInterval on it:
if(typeof update === "function") {
setInterval(update, 1000);
}
To make it explicit that you're refering to a global update and not a local variable, you can use window.update instead. In that case, you could also check if it exists this way:
if(update in window)
I am trying to understand this code:
function setIdle(cb, seconds) {
var timer;
var interval = seconds * 1000;
function refresh() {
clearInterval(timer);
timer = setTimeout(cb, interval);
};
$(document).on('keypress, click', refresh);
refresh();
}
setIdle(function() {
location.href = location.href;
}, 5);
setIdle takes two arguments. Inside its function it has a function refresh that clears a timer on a Timeout function. Now every time when an event happens (click, keypress) refresh() gets called.
and then finally this function gets called passing in another function and and int value (5) which later will be the amount of seconds for the timer. In that other function which later is represented through cb the page will be refreshed (location.href = location.href;).
This causes an automaticpage refresh every 5 seconds.
So now I don't understand if I put an additional function:
setIdle(function() {
console.log('hi');
}, 1);
Why is the second function only called once and not every second like the other one?
setIdle doesn't run the callback function every 5 seconds. It runs it once, 5 seconds after you call setIdle, and if you type or click something the timeout gets pushed back again. So it runs it once, when you've been idle for 5 seconds.
The reason the page refreshes every 5 seconds is because the callback function reloads the page, and reloading the page runs all the Javascript in the page again, so that calls setIdle() again.
But your second use of setIdle doesn't reload the page, so it just logs hi once.
If you want to do something repeatedly every N seconds, use setInterval rather than setTimeout.
BTW, clearInterval should be clearTimeout. In most browser they're currently interchangeable, but there's no guarantee. See Are clearTimeout and clearInterval the same?
I'm not 100% sure how setTimeout works in JavaScript. Say I have something like this:
$(document).ready(function() {
testTimeout();
});
function testTimeout() {
alert("testing timeout");
setTimeout(testTimeout, 5000);
}
This would display a popup window every 5 after the page is ready. What would happen if then I called testTimeout from a button click?
$("#button").click(function() {
testTimeout();
});
Would the button click call testTimeout and add another timeout every 5 seconds? Or, would the button click reset the timeout from when the button was pressed? The reason I am asking is because I would like to design something like this where I can pass a parameter to my timeout function. When the web page starts up, I have a default parameter. However, if I press a button, I would like my timeout function to be called right away and every 5 seconds after with my new parameter. But, I don't want the timeout function with the old parameter to continue repeating. How can I achieve this? Any help and understanding would be greatly appreciated.
This would display a popup window every 5 after the page is ready.
No it wouldn't, it would show an alert repeatedly with no delay and/or cause a "too much recursion" error, because setTimeout(testTimeout(), 5000) calls testTimeout and passes its return value into setTimeout, just like foo(bar()) calls bar and passes its return value into foo.
If you remove the ():
function testTimeout() {
alert("testing timeout");
setTimeout(testTimeout, 5000);
// here --------------^
}
Then it would do that.
What would happen if then I called testTimeout from a button click?
You'd end up with the function being called twice as often (more than once every 5 seconds), because every time you call it, it reschedules itself. A third time would make it more frequently still (three times/second), and so on.
If you want to avoid that, one option is to remember the timer handle and cancel any outstanding timed callback if you call the function before then:
var handle = 0;
function testTimeout() {
clearTimeout(handle); // Clears the timed call if we're being called beforehand
alert("testing timeout");
handle = setTimeout(testTimeout, 5000);
}
(I initialized handle with 0 because calling clearTimeout with a 0 is a no-op.)
Have you tried to asign variable to your setinterval;
var foo = setTimeout(testTimeout(), 5000);
and then when right event comes just destroy that variable.
clearInterval(foo);
And now you can asign it again...
In your case it would simply repeat endlessly, because you're executing the function instead of passing the reference. You should do it like this:
function testTimeout() {
alert("testing timeout)";
setTimeout(testTimeout, 5000);
}
Note the missing braces after testTimeout. This tells setTimeout to execute that function, instead of the result of that function, which is how your original code behaved.
" I would like my timeout function to be called right away and every 5 seconds after with my new parameter. But, I don't want the timeout function with the old parameter to continue repeating "
In order to achieve what you're trying to do you should remove the timeout:
var timeoutId;
function testTimeout() {
alert("testing timeout)";
clearTimeout(timeoutId );
timeoutId = setTimeout(testTimeout, 5000);
}
Notes:
You can stop the previous timeoutI from firing by catching the id returned from the setTimeout method and passing that to the clearTimeout method
I have created a JavaScript function that does the following:
function myFunction() {
DoStuff;
watch = setTimeout(myFunction, 1000);
}
where
watch
is a global variable initially set to null.
Then, I have a second function, that can be called at any moment, of the form:
function mySecond() {
DoStuff;
clearTimeout(watch);
}
Now, it happens sometimes that, although the second function is called and the timeout is somehow cleared, the first function is called another time. I guess this is happening because when the second function is called, a request for the first function has already been sent, and thus the timer works another time, and keeps calling itself over and over... I would like to point out that this does not happen always, I guess it depends on a specific timing condition you can encounter.
How to safely remove ALL the possibilities that the first function is called again?
Problem with this code is watch holds the last timeout only. This should fix it
function myFunction() {
DoStuff;
if (watch) { clearTimeout(watch); }
watch = setTimeout(myFunction, 1000);
}
I have a java script function that i have called on body load mousemove() the function is working but the problem is that function is not overloading. Here is the code:
function timeout(){
setTimeout ("logout()",60000);
}
function logout()
{
parent.parent.location="logout.php";
}
<body onmousemove="timeout()" >
now the problem is it calls on body load and whenever mouse moves but the page still move to the logout page after the specified time however it should override the time whenever mouse moves and the function calls.
Each time you call setTimeout it adds another call to the queue. In other words, you aren't replacing the current timeout. To fix it, you will need to cancel the existing timeout event before you start another one by calling clearTimeout with the value of the previous call to setTimeout.
var timeoutID = null;
function timeout() {
if (timeoutID !== null) {
clearTimeout(timeoutID);
}
timeoutID = setTimeout(logout, 60000);
}
I also changed the call to setTimeout to pass a reference to the logout function instead of a string. It's best to avoid passing a string since it uses eval and isn't necessary.