Question

所以我现在正在开发一个chrome扩展，以便介绍Web开发的世界。我遇到了一个似乎无法解决问题的问题。目前，我的background.js使用以下命令获取所有打开的窗口以及每个打开的选项卡：

function getAllOpenWindows(winData) {
  var tabs = [];
  for (var i in winData) {
    /*if (winData[i].focused === true) {*/
        var winTabs = winData[i].tabs;
        var totTabs = winTabs.length;
        for (var j=0; j<totTabs;j++) {
          tabs.push(winTabs[j].url);
        }
    /*}*/
  }
  console.log(tabs);
}

实际上是由bpatel here发布的。现在，您可以看到注释行，它允许我决定是从当前聚焦窗口还是从所有窗口中获取选项卡。我的问题是，一旦将扩展加载到chrome并且正在被主动使用，我究竟能如何动态地更改此设置？因此，如果用户进入选项并说他们只想要所有窗口我就能将消息传递给我的background.js说“嘿使用所有窗口功能而不是当前聚焦窗口”。我知道理想情况下应该使用2个单独的函数，这只是一个如何完成它的示例。万分感谢！

Answer 1

您可以使用localstorage保存任何用户设置。选项页面和后台页面共享相同的本地存储，因此您可以从选项页面更新设置并从后台页面访问该值。

<强> options.html

<input type="checkbox" id="windowType" value="All">Check all windows</input>
<input type="button" id="saveSettings" value="Save">Save</input>

<强> options.js

document.getElementById("saveSettings").onclick = save_settings;
function save_settings()
{
   var checkAll = document.getElementById("windowType").checked;
   localStorage.setItem("check_all_windows",checkAll);
}

当加载选项页面时，您可以使用类似的功能用当前值更新复选框的值。

<强> background.js

function getAllOpenWindows(winData) {
  var tabs = [];
  for (var i in winData) {
    var checkAll = (localStorage.getItem("check_all_windows") == "true");
    if (checkAll || winData[i].focused === true) {
        var winTabs = winData[i].tabs;
        var totTabs = winTabs.length;
        for (var j=0; j<totTabs;j++) {
          tabs.push(winTabs[j].url);
        }
    }
  }
  console.log(tabs);
}

在background.js中，您可以从localStorage获取相同键的值，并检查它是否设置为true或false。请记住，localStorage会将值存储为字符串，因此您需要将其与正确的字符串进行比较 - 如果（＆＃34; false＆＃34;）将评估为true。

如何动态更改background.js以反映用户在chrome中的设置？

1 个答案: