javascript - link - simulate click jquery

JQuery inyectando clic()

Question

Actualmente estoy construyendo una extensión de navegador que inyecta javascript / jquery en ciertas páginas, y estoy teniendo un problema extraño, donde forzar eventos .click() no funcionan desde mi código inyectado. Lo extraño es que funciona completamente bien si realizo la llamada desde la consola de mi consola js.

Realmente no entiendo cuál es el problema. Parece que todas mis otras llamadas están funcionando bien. Puedo enlazar para hacer clic en eventos usando .click(function(){...}) (así que claramente mi jquery se ha cargado correctamente), y invoco métodos cuando se hacen clic en las cosas (así que claramente mi jquery se ha cargado correctamente), pero el segundo, cuando trato de forzar un clic, la llamada simplemente no se procesa.

¿Alguien puede explicar lo que está sucediendo o una forma de evitarlo?

(No puedo recrear este problema, porque el problema claramente tiene que ver con inyectar el js en una extensión)

esto es lo mejor que puedo hacer para la recreación:

//I have tried all of these separately
console.log($("#this_is_an_id")) //This returns the correct element
$("#this_is_an_id").click() //This does not work at all
$("#this_is_an_id").trigger("click") //I have also tried this without success
$("#this_is_an_id").click(function(){ console.log("stuff") }) //This works fine.

Realmente, en este punto, asumo que no es mi culpa, sino algo que está mal con el método de inyección del script del navegador. Estoy buscando maneras realmente hackeantes para arreglar esto, también probé eval(''$("#this_is_an_id").trigger("click")'') . ¿Alguien tiene alguna otra sugerencia?

Answer 1

Finalmente encontré una excelente respuesta / solución a este problema aquí: ¿ desencadenar eventos desde la extensión del navegador Firefox?

Del usuario cms :

En primer lugar, para los eventos de clic, debe crear un objeto de evento con tipo MouseEvents, no HTMLEvents, y usar event.initMouseEvent en lugar de event.initEvent.

Para acceder al documento de la pestaña actual de Firefox desde una superposición XUL, puede usar la propiedad content.document, pero como ya tiene acceso al elemento DOM que desea hacer clic, puede usar la propiedad Node.ownerDocument, que consulte el objeto de documento de nivel superior para este nodo.

He hecho una función simple para simular MouseEvents:

function triggerMouseEvent(element, eventName, userOptions) {
var options = { // defaults
clientX: 0, clientY: 0, button: 0,
ctrlKey: false, altKey: false, shiftKey: false,
metaKey: false, bubbles: true, cancelable: true
// create event object:
}, event = element.ownerDocument.createEvent("MouseEvents");
if (!/^(?:click|mouse(?:down|up|over|move|out))$/.test(eventName)) {
throw new Error("Only MouseEvents supported");
}
if (typeof userOptions != ''undefined''){ // set the userOptions
for (var prop in userOptions) {
if (userOptions.hasOwnProperty(prop))
options[prop] = userOptions[prop];
}
}
// initialize the event object
event.initMouseEvent(eventName, options.bubbles, options.cancelable,
element.ownerDocument.defaultView, options.button,
options.clientX, options.clientY, options.clientX,
options.clientY, options.ctrlKey, options.altKey,
options.shiftKey, options.metaKey, options.button,
element);
// dispatch!
element.dispatchEvent(event);
}

Uso: triggerMouseEvent (elemento, ''clic'');

Verifique el uso de la prueba aquí.

También puede pasar un objeto como tercer argumento, si desea cambiar los valores de las propiedades del objeto de evento.

Muchas gracias por esta respuesta. O_O