不能在Chrome扩展中使用jQuery触发点击 [英] Can't trigger click with jQuery in a Chrome extension

问题描述

我正试图用一行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。

这篇关于不能在Chrome扩展中使用jQuery触发点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！