事件在Chrome插件中不起作用

所以，我一直在這個問題上來回奔走。我想要的是在網站上按下按鈕時執行一段代碼（在inject.js文件中）。我想運行自己編寫的代碼。事件在Chrome插件中不起作用

這應該可以嗎？我已經查閱了它，這是從開發人員文檔中獲取的：

內容腳本在稱爲孤立世界的特殊環境中執行。他們可以訪問它們被注入頁面的DOM，但不能訪問該頁面創建的任何JavaScript變量或函數。 它看起來像每個內容腳本，就好像在上運行的頁面上沒有執行其他JavaScript一樣。反過來也是如此：頁面上運行的JavaScript不能調用任何函數或訪問由內容腳本定義的任何變量。

從示例中可以看出，也發現在同一頁面上（http://developer.chrome.com/extensions/content_scripts.html#execution-environment）我應該可以附加一個單擊事件點擊該按鈕時，是否有相同的.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); 
});

但是當我按「添加類」無happends。

任何人都可以解釋爲什麼嗎？我做錯了嗎？

上面的代碼來自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.

來源

2013-01-06 netigger

綁定到'click'監聽器的元素'add_cat_input'不是一個按鈕，而是一個文本字段。「添加類別」按鈕沒有ID。 – Stan

順便說一下，你的'permission'部分不包含'https：// */*'，而內容腳本被注入到「https：// ...」中。 – Stan

將嘗試在第二個斯坦，這可能是問題:) – netigger

綁定到click偵聽器的元素add_cat_input - 不是一個按鈕，而是一個文本字段。按鈕「添加類別」在您的代碼中沒有ID。

來源

2013-01-06 12:03:13 Stan

事件在Chrome插件中不起作用

回答

相關問題