如何切换浏览器操作的操作?

Pri*_*nal 2 google-chrome google-chrome-extension

我创建了我的第一个chrome扩展,它在点击时为页面上的所有锚元素添加了事件处理程序.如果用户第二次单击该图标,则事件处理程序将重新附加到锚元素并执行两次.我需要的是什么

  • 单击浏览器操作.
  • 将事件添加到锚元素
  • 如果可能,请在浏览器操作图标中提供当前扩展名处于活动状态的视觉提示.
  • 再次单击扩展名应删除事件处理程序,并再次将扩展图标显示为已禁用.

这可能吗?

以下是我到现在为止所尝试的.

的manifest.json

{
    "name":"NameExtension",
    "version":"1.0",
    "description":"Here goes the description",
    "manifest_version":2,
    "browser_action":{
        "default_icon":"16x16.png"
    },
    "background":{
        "scripts":["background.js"]
    },
    "permissions":[
        "tabs","http://*/*","https://*/*"
    ]
}
Run Code Online (Sandbox Code Playgroud)

background.js

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.executeScript(null, {file: "contentscript.js"});
});
Run Code Online (Sandbox Code Playgroud)

contentscript.js

var all = document.getElementsByTagName('a');
for(var i=0; i<all.length;i++){
    all[i].addEventListener('click',myHandler, false);
}

myHandler = function(event){
    alert(event.target.innerText);
}
Run Code Online (Sandbox Code Playgroud)

我希望上面的处理程序在锚点上切换,因为点击并重新点击了extension_browser_action.此外,如果extension_browser-action_icon可以提供有关状态的一些视觉反馈.

Pri*_*nal 6

我能够在我的background.js中执行此操作,其中contentscript添加了处理程序,togglecontentscript将其删除.

var x = false;
disableBrowserAction();

function disableBrowserAction(){
    chrome.browserAction.setIcon({path:"inactive.png"});
    chrome.tabs.executeScript(null, {file: "togglecontentscript.js"})
}

function enableBrowserAction(){
    chrome.browserAction.setIcon({path:"active.png"});
    chrome.tabs.executeScript(null, {file: "contentscript.js"});
}

function updateState(){
    if(x==false){
        x=true;
        enableBrowserAction();
    }else{
        x=false;
        disableBrowserAction();
    }
}

chrome.browserAction.onClicked.addListener(updateState);
Run Code Online (Sandbox Code Playgroud)