Develop Reference

Clicking a button with a chrome extension (ERROR/Not working)

Hello I want to click a button multiple times when on a specific website. I have no idea whats wrong but maybe someone can help me out
function pay(){
document.getElementsByClassName("btn btn--lg btn--full u-margin-b--xl js-place-order2 js-place-order-btn")[0].click();
}
if(window.location.href.includes("https://www.revolveclothing.fr/r/ReviewConfirm.jsp?enteraccount")){
var sleep = setTimeout(pay, 50)
}
The element I am Clicking is the correct one since it works in the chrome console
I hope someone can help me

Since you're using setTimeout, the button will only be pressed once after 50ms is elapsed.
Assuming you want it to be pressed consistently every 50ms, you should change the setTimeout to setInterval like so:
var sleep = setInterval(pay, 50);

Click event not triggering for every iteration of for loop

I want to automate this page to generate exam results. I want to generate exam results from one particular date to some other particular date. On clicking the submit button, the page generates another page in a new tab.
Manually clicking 10 times will generate 10 tabs. But see the following code:
for(let i=0;i<10;i++)
{
document.querySelector('#reg1').click();
console.log(`clicked ${i}th time`)
}
I want to trigger a click 10 times and it should generate 10 tabs accordingly. But the problem is that the click works only works on the 10th iteration and spawns 1 tab only. Help me.
see
Edit:
#Jesse
See my utility full code:
var dateFrom=new Date('2017-01')
var dateTo=new Date('2019-01')
for(var i=dateFrom;i<dateTo;i.setMonth(i.getMonth()+1))
{
// console.log(`${i.getFullYear()}-${i.getMonth()}`);
// var dd=`${i.getFullYear()}-${i.getMonth()}`;
var dd=new Date(i).toISOString().substr(0,7);
console.log(dd);
document.querySelector("input#picker.form-control").value=dd;
var type='Supplementary'
document.querySelector("select#result_type.form-control.form-email.selectoption").value=type;
document.querySelector('#reg1').click();
}

Somehow you have to execute the subsequence clicking in an asynchronous manner. I got this work by this:
let i=0;
(function doClick(){
document.querySelector('#reg1').click();
i++;
if(i<10) setTimeout(() => doClick());
})()
Another approach using async function:
(async function doClick() {
for(let i=0;i<10;i++) {
document.querySelector('#reg1').click();
await new Promise(setTimeout);
}
})()

I just figured out that my browser's popup blocker is stopping the subsequent tabs from being opened.
Try turning off your popup blocker. I was able to trigger the behavior you're after with mine off.
It works when you click it because it's a user interaction, so the blocker assumes it's something you're actively trying to do. If you trigger it programmatically, repeatedly, it gets blocked. This makes sense given that one of your browser's popup blocker's primary functions is to prevent sites from trapping you in infinite popup hell.

It's because you're using the same ID. Either switch to using a class or change the ID names so they aren't identical.

Javascript code to Click a Button on a Webpage for every 5 Minutes

I have a webpage and it has a Refresh Button. I need to click the button every 5 minutes. The Normal Refresh or Reload or F5 doesn't work in this situation. Is there a way that Javascript can do this task.
Like, I will save the javascript as Bookmark and once I click the bookmark. Then, the javascript event has to click the refresh button every 5 minutes.
I googled it and I found the below code. But, it doesn't work. When I click on it, it just showing a random number in a blank page.
javascript:if(window.autoRefreshInterval) { clearInterval(window.autoRefreshInterval); };
window.autoRefreshInterval = setInterval(function() { jQuery(".refresh").click(); },60000)
thank you in advance,

"I have a webpage and it has a Refresh Button. I need to click the
button every 5 minutes. The Normal Refresh or Reload or F5 doesn't
work in this situation. Is there a way that Javascript can do this
task."
It's not very clear to me, but every time you refresh a webpage, javascript is loaded again. So if you have intervals or variables they are reset at each refresh. If you want to keep some value among refreshs you can store values using localStorage or cookies for example.
If you want refresh automatically page you can use setInterval or metatag "refresh".
"Like, I will save the javascript as Bookmark and once I click the
bookmark. Then, the javascript event has to click the refresh button
every 5 minutes."
Look at this: Add a bookmark that is only javascript, not a URL

you can call your refresh code function or button click event in
setTimeout(yourFucntion(),5000);
else
setTimeout($("#btnName").click(),5000);

Try below code:
<!DOCTYPE html>
<html>
<body onload="f1()">
<script language ="javascript" >
var tmp;
function f1() {
tmp = setInterval(() => f2(), 2000); // replace this with 5 min timer
}
function f2() {
document.getElementById("Button1").click();
}
function f3() {
console.log("Hello World");
}
</script>
<button id="Button1" onclick="f3()">click me</button>
<div id="demo"></div>
</body>
</html>

There are two versions for you to try, one uses javascript to click the button the other automates running the function that they have tied to the button.
Non jQuery:
javascript:(function(){if(window.autoRefreshInterval) {clearInterval(window.autoRefreshInterval);}window.autoRefreshInterval = setInterval(function(){document.getElementsByClassName("refresh")[0].addEventListener('click');},60000);})()
Or with jQuery (OP's comment on original thread):
javascript:(function(){if(window.autoRefreshInterval) {clearInterval(window.autoRefreshInterval);}window.autoRefreshInterval = setInterval(function(){$ctrl.refresh();},60000);})()

Delayed post, but hopefully it helps someone :-).
The trick for me was locating the element by css document.querySelector('.pbi-glyph-refresh').click();
You can combine this with the original code like so, it correctly clicks the PowerBI refresh button on a 60 second timer (the var is in ms).
javascript:if(window.autoRefreshInterval) { clearInterval(window.autoRefreshInterval); };
window.autoRefreshInterval = setInterval(function() {document.querySelector('.pbi-glyph-refresh').click(); },60000)

javascript window confirm pops up several times

i am trying to use the confirm method but for some reason the confirm window pops up several times. I googled and tried different things but unfortunately I can't get it running properly. The code is the following:
//user clicks on the delete button
$("#deletePopUpImage").click(function(){
console.log("deletePopUpimageCalled");
//get the id of the image
id = ($(this).parent().prop("id"));
//create the ajax request
data = "typ=function&functionType=deleteUserImage&id="+id;
//open the confirm box
var r = confirm("Are you sure that you want to delete this image?");
if (r == true) {
console.log("loadAjaxCAlled");
//Ajax call
loadAjax(data);
//hide the image and the loader
hideImagePopup();
} else {
//do nothing
}
});
The strange thing is that sometimes the confirm window pops up twice, sometimes three times and sometimes as expected once. That's why inserted the two console.logs.
"deletePopUpimageCalled" always appears just once. However "loadAjaxCAlled" appears several times.
In the success callback of the Ajax request I am just hiding the thumbnail div.
Do you know what's wrong with my code above?
Thanks
Stefan

Probably the code that attaches the event:
$("#deletePopUpImage").click(function(){...});
is invoked several times. Every invocation of .click(...) makes a new handler that fires when the button is clicked.
Some browsers stack up log the same entries into one (so the log doesn't extend so fast), that could be the reason you don't see "deletePopUpimageCalled" many times.
It would the best to check this by debugging it in the browser.

Ok I found the problem. In the Ajax success handler I set the div of the image, that was deleted, to display:none instead of deleting it. Thus divIds could occur twice, three times, etc. After changing the code to delete, it worked smoothly.

How to reset jquery dialog timeout for next dialog?

I have an add-to-bag button used throughout our site and we want a dynamic popup to appear to acknowledge what was just added, and then it goes away. I'm finding that if you click another add button, it has the previous dialog's timeout attached. To fix this so the next dialog has its own 10,000 setTimeout rather than whatever is left over from the last one I have come up with the following code (that doesn't do the trick).
$(document).ready(function ()
{
// Create object for future dialog box - so it's available to the close method
var addToBagDialogVar = $('<div id="addToBagDialogBox"></div>');
var autoCloseTimeout = 10000;
var dialogTimer;
$(".addToBagPU").click(function (e)
{
var result = "";
$.get(this.href, function (data) { SetData(addToBagDialogVar, data); });
return false;
});
// Start listening for the close link click
$(document).on("click", "#bagPUCloseLink", function (event)
{
event.preventDefault();
CloseDialog(addToBagDialogVar);
});
function SetData(addToBagDialogVar, data)
{
result = data;
var regex = data.match("{{(.*)}}");
var bagCount = regex[1];
addToBagDialogVar.html(result).dialog({
open: function ()
{
clearTimeout(dialogTimer);
$(".ui-dialog-titlebar-close").hide();
SetBagCount(bagCount),
dialogTimer = setTimeout(function () { CloseDialog(addToBagDialogVar); }, autoCloseTimeout);
},
show: { effect: "fadeIn", duration: 800 },
close: function () { clearTimeout(dialogTimer); },
width: 320
});
}
function CloseDialog(closeThisDialog)
{
closeThisDialog.dialog("close");
closeThisDialog.dialog("destroy").remove();
}
});
The dialog is loaded with dynamic content from an external .Net page with product data and has a close link inside that page, which is why the dialog is loaded into addToBagDialogVar so it's available to CloseDialog.
All of that works just fine. It's just the reset of the timer that doesn't appear to be happening. If I go down a page of products and add each one to my bag, the 3rd or 4th dialog is only up for a second or so because they have all been using the first dialogs setTimeout.
I've read and read and tried too many different ways to remember and now my brain is mush.

I propose an alternate explanation for the behavior you're observing. When you click the first "add to cart", a timer is started. As you go down the page clicking "add to cart", a new timer is started each time. There's no overlap, just a bunch of separate timers running normally (although incidentally, each new dialog box blows away the timer ID you've previously created; I'll come back to this).
When your first dialog's timer expires, the dialog closes itself via the HTML ID, meaning it closes itself with something like a jquery $('div#addToBagDialogBox').closeOrSomethingLikeThat(), that is, every dialog inside a div with an id of addToBagDialogBox. The first timer expiration is closing all of your dialogs, because they all use that same HTML ID. The other timers are running perfectly, but when they expire there's nothing left for them to do.
You can fix the early-close problem by assigning a unique HTML ID to each dialog you create. And you'll want to manage your timer IDs on a per-dialog basis as well, such that each dialog has its own timer ID.
Edit: Just for nerdy grins, think about the details of the scenario you described. Your first timer is running, counting down normally, and you start four other timers while the first dialog is still there. The ID of the fifth timer is in your variable dialogTimer. So when the first dialog's timer expires, the close processing occurs, and you call clearTimeout with the ID of the fifth dialog's timer. So your first dialog's timer expired, the dialog closed all the other dialogs, and the cleanup cancelled the fifth timer. There are three other timers still running, their IDs lost forever. They finally expire and their shutdown functions run, but they're totally without effect, their companion dialogs long gone. Sorry, bona fide nerd here.