jQuery click() to trigger HTML's OnClick property

Question

I have (had?) this Greasemonkey script that uses quite a bit of jQuery to set some defaults in a web form. The web form is a from an HP Wireless network controller, so I don't believe I can modify the HTML being generated.

The script was working just fine, until a Firefox update came along. Now, all jQuery click() and dblclick() calls are not working. They throw an exception:

Permission denied to access property 'length'

The HTML that I'm trying to "click" is:

<input id="plan_selection-1" type="radio" onclick="UpdateSectionStates();" value="valid_time" name="plan_selection">

I am using the follwoing jQuery to click:

$('#plan_selection-1').trigger("click");

I have tried a few different things (using .click(), which I gather is the same as .trigger("click"), sending an actual mouse event as described on jQuery click() not working in a Greasemonkey/Tampermonkey script , however this failed, as dispatchEvent() "is not a function".

This had been working up until a few weeks ago, but I haven't gone back to figure what exact version of FF last worked on.

Any direction or help is appreciated.

Answer 1

There are a couple workarounds to this issue.

You can try to see if click events are working for pure JS

 document.getElementById("plan_selection-1").click();

Otherwise if you just want to set the element to selected and call your function...

document.getElementById("plan_selection-1").checked = true;
UpdateSectionStates();

You may want to test to see if JQuery is working at all by checking if the selector returns an element or not.

Answer 2

Have you tried to dispatch the events manually ie pure js

var input = $('#plan_selection-1')[0];
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
0, 0, 0, 80, 20, false, false, false, false, 0, null);
input.dispatchEvent(evt);

Explanation: this is the way you would trigger the event in pure js. Also you don't need to recreate the mouse evet you can dispatch the same one multiple times to different elements so if this works, you can create one mouse event and just replace every $('#plan_selection-1').trigger("click") with $('#plan_selection-1')[0].dispatchEvent(evt) in order to get your code to work.