javascript - 从 Firefox 浏览器扩展触发事件？

Question

我想从 Firefox 扩展中触发事件，特别是点击事件。我试过 jQuery 的 .click() 以及整个:

 var evt = document.createEvent("HTMLEvents");
 evt.initEvent("click", true, false );
 toClick[0].dispatchEvent(evt);

这对我不起作用，我想知道这是否可能？ (从 Firefox 扩展触发事件)？

我认为这可能与我创建事件的文档有关...但我不确定。

如果是这样，如何做到这一点？

Answer 1

首先，对于 click 事件，您需要创建一个类型为 MouseEvents 的事件对象，而不是 HTMLEvents，并使用 event.initMouseEvent 代替的 event.initEvent。

要从 XUL 覆盖访问 Firefox 当前选项卡的 document，您可以使用 content.document 属性，但是由于您已经可以访问要单击的 DOM 元素，您可以使用Node.ownerDocument 属性，它将引用此节点的顶级 document 对象。

我做了一个简单的函数来模拟 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);
}

用法:

triggerMouseEvent(element, 'click');

检查测试用法 here 。

如果你想改变 event object 属性的值，你也可以传递一个对象作为第三个参数。