Question

所以，我一直在回答这个问题。我想要的是在网站上按下按钮时执行一段代码（在inject.js文件中）。我想运行我自己编写的代码。

这应该可以吗？我查了一下，这是从开发人员文档中获取的：

内容脚本在称为孤立世界的特殊环境中执行。他们可以访问注入页面的DOM ，但不能访问页面创建的任何JavaScript变量或函数。 它会查看每个内容脚本，就好像在其运行的页面上没有执行其他JavaScript 。反过来也是如此：页面上运行的JavaScript不能调用任何函数或访问内容脚本定义的任何变量。

从示例中可以看到，也可以在同一页面上找到（http://developer.chrome.com/extensions/content_scripts.html#execution-environment）我应该可以将click事件附加到某个内容上单击该按钮时，来自相同.js文件的执行代码？正确？

无论如何，这是我写的代码：

$sidebar = $('<div><div></div></div>')
    .css('background', '#eee')
    .css('width', '20%')
    .css('position', 'fixed')
    .css('right', '0px')
    .css('top', '0px')
    .css('height', '100%');

$form = $('<br/><center><div class="input-append">\
  <input class="span2" id="add_cat_input"  type="text">\
  <button class="btn" type="button">Add category</button>\
  </div>\
  <div class="input-append"><select id="categories">\
  <option>A</option>\
  <option>B</option>\
  <option>C</option>\
  <option>D</option>\
  <option>E</option>\
</select>\
<button class="btn" type="button">Edit</button><button class="btn" type="button">Delete</button>\
</div></center>');

$('body').prepend($sidebar);
$sidebar.append($form);

$(document).ready(function() {
    console.log(document.getElementById("add_cat_input"));
    document.getElementById("add_cat_input").addEventListener("click", function() {
        console.log('hej');
}, false);
});

但是当我按“添加类别”时没有任何事情发生。

任何人都可以解释原因吗？我做错了吗？

上面的代码来自myscript.js。这是我的manifest.json

{
  "name" : "πSpend",
  "version" : "0.1",
  "description" : "Creates a piechart of the spendings in your bankaccount.",
  "permissions": [ "cookies", "tabs", "http://*/*", "contextMenus" ],
  "icons": { "16": "cookie.png", "48": "cookie.png", "128": "cookie.png" },
  "browser_action": {
    "default_icon": "cookie.png",
    "default_popup": "popup.html"
  },
  "background": {
    "scripts": ["background.js"]
  },
  "manifest_version": 2,
  "content_scripts": [
    {
      "matches": ["https://internetbanken.privat.nordea.se/*"],
      "css": [ "bootstrap.min.css" ],
      "js": ["jquery.js", "raphael-min.js", "g.raphael-min.js", "g.pie-min.js", "myscript.js"]
    }
  ]
}

在途中我尝试使用某种形式的消息发布，但是这一行：

var port = chrome.extension.connect();

给我这个错误：

Port error: Could not establish connection. Receiving end does not exist.

Answer 1

绑定到add_cat_input侦听器的元素click不是按钮，而是文本字段。 “添加类别”按钮在您的代码中没有ID。

事件不会在镀铬插件中触发

1 个答案: