Chrome扩展程序 - 未捕获的ReferenceError:$未定义

use*_*905 4 javascript jquery google-chrome-extension

我每次更新选项卡时都使用chrome.tabs API来运行脚本.脚本在页面中搜索关键字,如果找到它,它会提醒您,但如果没有,则会刷新页面.每当我测试扩展时,控制台告诉我:

控制台错误

的manifest.json

{
  "name": "keyword checker",
  "version": "1.0.0",
  "manifest_version": 2,
  "background": {
      "persistent":true,
      "page":"background.html"
  },
  "icons": {
    "16": "icon-16.png",
    "128": "icon-128.png"
  },
  "page_action": {
      "default_icon": "icon-128.png"
  },
  "permissions": [
    "<all_urls>",
    "tabs"
  ]
}
Run Code Online (Sandbox Code Playgroud)

background.html

<script src="jquery.js"></script>
<script src="background.js"></script>
Run Code Online (Sandbox Code Playgroud)

background.js

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){
  if(changeInfo && changeInfo.status == "complete"){
    chrome.tabs.executeScript(tabId, {file: "script.js"});
  }
});
Run Code Online (Sandbox Code Playgroud)

的script.js

if ($("div#wrap").is(":contains('comme')")) {
    alert('page contains keyword!');
  } else {
    window.location.reload(true);
  }
}
Run Code Online (Sandbox Code Playgroud)

我在这做错了什么?任何帮助表示赞赏.我已经包含在扩展根的jQuery.

nde*_*ore 8

您只在背景页面上包含了jQuery.您应该将jQuery注入到正在执行的选项卡script.js上.

这是一个jquery.js首先加载,然后在回调加载中的示例script.js:

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){
    if(changeInfo && changeInfo.status == "complete"){
        chrome.tabs.executeScript(tabId, {file: "jquery.js"}, function(){
            chrome.tabs.executeScript(tabId, {file: "script.js"});
        });
    }
});
Run Code Online (Sandbox Code Playgroud)