不能在Chrome扩展中使用jQuery触发点击
我正试图用一行jQuery代码创建一个Chrome扩展,但它不起作用。我正在尝试触发对元素的单击。
Chrome的控制台根本没有显示任何错误, 当我只将jQuery代码放入控制台时,它工作得很好。我的代码:
content.js
$(document).ready(function() {
$('.like_post:contains(Like)').click();
});
背景.js
chrome.windows.getCurrent( function(currentWindow) {
chrome.tabs.query({active: true, windowId: currentWindow.id}, function(activeTabs){
chrome.tabs.executeScript(
activeTabs[0].id, {file: 'jquery-2.1.3.min.js', allFrames: true}
);
chrome.tabs.executeScript(
activeTabs[0].id, {file: 'content.js', allFrames: true}
);
});
console.log(currentWindow.id);
});
mark.json
{
"name": "plugin name",
"version": "0",
"description": "What do I do as an extension",
"manifest_version": 2,
"browser_action": {
"name": "project with jquery",
"icons": ["icon.png"],
"default_icon": "icon.png"
},
"content_scripts": [ {
"js": [ "jquery-2.1.3.min.js", "background.js", "content.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
}
我还下载了jquery-2.1.3.min.js
文件并将其放在扩展文件夹中。
有人能解释一下为什么它不工作吗?
解决方案
问题的根本原因是扩展内容脚本在isolated world中执行。这样做的原因之一是为了使您的代码不与页面的代码冲突:例如,您可以使用不同版本的jQuery。
因此,您的内容脚本有自己的jQuery副本。JQuery.click()
的工作方式是维护由单击触发的事件处理程序列表。
..您可能已经看到了这个问题。内容脚本的jQuery副本不知道页面的处理程序副本列表和cannot trigger them。
顺便说一句,这解释了当您将其放入控制台时它为什么会起作用--默认情况下,console executes in the page's context并触发页面的jQuery副本。
有很多方法可以克服这一点,但对于您的任务来说,最直接的方法是发出一个正确的DOM事件,该事件将被页面的代码捕获。有关示例,请参阅this question。
相关文章