从内容脚本触发点击事件 - chrome扩展

Question

在我的Chrome扩展程序的内容脚本中,我点击了某些网站上网页上的某些链接/按钮.为此,我在内容脚本中使用以下代码(我在内容脚本中嵌入了jQuery):

$(css_selector).trigger("click")

这适用于大多数网站.

但是,在delta.com,match.com和paypal.com等某些网站上,这种触发元素点击的方式不起作用.在delta.com上,当我尝试在内容脚本中触发时,我得到以下抛出的异常:

Error: An attempt was made to reference a Node in a context where it does not exist.
Error: NotFoundError: DOM Exception 8

奇怪的是,如果我打开javascript consoleon delta.com,包含一个jQuery并尝试相同的点击触发代码片段,它就可以了.

在match.com和paypal.com上,触发只是在内容脚本中不起作用并且没有错误.我甚至无法通过javascript控制台触发"click"事件,就像我在delta.com上所做的那样.

如果我手动使用鼠标单击,所有三个网站上的一切正常.因此我也尝试使用mousedown(),mouseup()模拟它,但这也不起作用.

这似乎是个问题,因为来自这些网站的javascripts正在劫持和忽略事件.我试图从这些网站读取代码,看看发生了什么,但代码太多了.

有没有人知道这里发生了什么以及如何解决它？

Answer 1

由于浏览器扩展sand-boxing和基本jQuery功能,您无法使用trigger或触发非jQuery单击事件click.

但是,您可以调用原始DOM元素click方法,该方法的作用就像使用鼠标单击该元素一样.只是[0]用来访问DOM元素:

$(css_selector)[0].click();

虽然您很少需要,但您可以使用相同的代码触发所有匹配的按钮each.由于这是一个eachDOM元素,它很简单:

$(css_selector).each(function(){
    this.click();
});

Answer 2

jQuery的单击触发器函数不会触发非jQuery DOM单击侦听器(jsfiddle.net/k2W6M).

jQuery文档应该真正指出这个事实.我敢肯定,不止一些人对此进行疯狂的追逐.

几天我一直在努力解决同样的问题,尝试在.click()和.trigger("click")的链接上触发一个onclick处理程序,一切都是徒劳的,直到我看到这个.

为了完整回答这个问题,将MouseEvent分派给元素与单击元素具有相同的效果.以下代码适用于我,并且在尝试从内容脚本单击页面上的元素/链接时应该起作用:

$(css_selector)[0].dispatchEvent(new MouseEvent("click"))