javascript - 可打开和关闭的 Chrome 扩展程序

标签 javascript html google-chrome google-chrome-extension toggle

我正在尝试创建一个扩展程序,该扩展程序可以打开和关闭另一个特定扩展程序。然而,我尝试了一遍又一遍,却没有找到可行的方法。

基本上,我的扩展程序会弹出一个带有开/关开关(复选框)的弹出窗口,我需要对其进行设置,以便它可以打开和关闭另一个扩展程序...

这是我的 popup.html

<!DOCTYPE html>
<html>
<body>
    <link href='http://fonts.googleapis.com/css?family=Oswald:400,700,300' rel='stylesheet' type='text/css'>
  <p class="bb">Liga/Desliga do Banco do Brasil</p>
<div class="onoffswitch">
    <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch">
    <label class="onoffswitch-label" for="myonoffswitch">
        <span class="onoffswitch-inner"></span>
        <span class="onoffswitch-switch"></span>
    </label>
</div>
<script type="text/javascript" src="js/script.js"></script>
</body>
</html>

和 popup.js

var bankId = "mkeabchhfifpaaoefpockjhaphjmoapp";

if(document.getElementById("myonoffswitch").checked != true)  {
                    chrome.management.setEnabled(bankId, false);


  } else if(document.getElementById("myonoffswitch").checked == true)
  {

                    chrome.management.setEnabled(bankId, true);

}

和manifest.json

{
   "browser_action": {
      "default_icon": "48.png",
      "default_title": "Liga/Desliga o Bando Do Brasil",
      "default_popup": "popup.html"
   },
   "description": "Clique para ativar/desativar a extensão do BB",
   "icons": {
      "128": "128.png",
      "16": "16.png",
      "48": "48.png"
   },
   "name": "Toggle Banco Brasil On/Off",
   "permissions": [ "tabs", "management" ],
   "update_url": "http://clients2.google.com/service/update2/crx",
   "version": "1.0",
   "manifest_version": 2
}

您可以在此处查看扩展“演示”:http://liveweave.com/8M4IvJ

感谢任何帮助!

最佳答案

让我们看看您的扩展程序当前的工作原理。

这是加载的弹出页面,默认情况下未选中该复选框。

然后,您的代码运行,检查该复选框是否已选中(未选中)并禁用您指定的扩展。

然后..什么都没有。你从未告诉 Chrome 做任何其他事情。您的代码已完成运行,没有事件监听器,因此现在它是一个静态页面。可能不是您想要的。

<小时/>

现在,让我们修复它。首先,我猜您想将复选框的初始状态设置为扩展的当前状态。足够简单:

chrome.management.get(bankId, function(info) {
  // Gotta check if we got the info:
  if(chrome.runtime.lastError) {
    // Something's not right; probably extension is not installed.
    // Warn the user somehow? (but no alert(), it can break the popup)
  }

  document.getElementById("myonoffswitch").checked = info.enabled;
});

接下来,我们不希望在打开弹出窗口时检查状态。相反,我们希望 Hook 一个事件,特别是每当复选框的值发生变化时。

同样,很简单:

document.getElementById("myonoffswitch").addEventListener("change", function(e) {
  // You don't need the conditional if() {} else {}, just use the binary value
  chrome.management.setEnabled(bankId, this.checked);
});

关于javascript - 可打开和关闭的 Chrome 扩展程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28664727/

相关文章:

asp.net - 有没有人将 ComponentOne ASP.NET AJAX 套件与其他库(例如 ExtJS)进行比较

javascript - 如何将(绝对)页脚保持在底部?

html - Chrome 上的 Textarea 轮廓只是黑色

javascript - 如何让网页测试时无响应

javascript - 如何检测浏览器是否可以在 iframe 中打开网络文件夹?

javascript - 如何从 json 对象构建 id 字符串

html - 显示单张特定的 Instagram 照片 - 可能吗?

css - 刷新适用于最新 Chrome 的 CSS Bookmarklet?

http - HTTP 1.0 服务器允许在收到完整请求之前回复客户端吗?

javascript - 使用 jquery 加载更多内容?