【问题标题】:checkbox checked is not working on extension chrome选中的复选框不适用于扩展 chrome
【发布时间】:2019-02-01 17:23:48
【问题描述】:

在扩展安装时,复选框被选中,但扩展不工作,扩展开始工作后,用户点击扩展图标,我希望扩展开始工作而不点击扩展图标,因为复选框被选中,somone知道如何解决这个问题吗?

popup.html

<div class="Av-AutoChangeButton">Player</div> 
<div class="onoffswitch" style="margin: 0 auto;">
<input type="checkbox" class="PlayerCheckBox onoffswitch-checkbox" id="AvVidPlayer" checked/>
<label class="onoffswitch-label" for="AvVidPlayer">
    <span class="onoffswitch-inner"></span>
    <span class="onoffswitch-switch"></span>
</label>
</div>

popup.js

document.addEventListener('DOMContentLoaded', function() {
    if (window.location.href.match('chrome-extension://')) {
        load();
    }
});

$("body").on("change", ".PlayerCheckBox", function() {
    var status = "";
    $(".PlayerCheckBox").each(function() {
        status = status + ($(this).is(":checked")) + ",";
    });

    save_option(status);
});

function save_option(option) {
    var save = {};
    save[option] = null;
    chrome.storage.sync.set({
        option : option
    }, function() {
        console.log(option + "save");
    });
}

function load() {
    chrome.storage.sync.get(null, function(obj) {
        console.log(obj);
        if (obj.hasOwnProperty("option")) {
            tab = obj.option.split(",");

            console.log(tab);
            var l = 0;
            $(".PlayerCheckBox").each(function() {
                $(".PlayerCheckBox:eq(" + l + ")").prop("checked", parseBoolean(tab[l]));
                l++;
            });
        } else {
        save_option("true,true,true,true,true,true");
        }
    });

}

function parseBoolean(str) {
    return /true/i.test(str);
}

backgrund.js

chrome.runtime.onInstalled.addListener(function(tab) {
   chrome.storage.sync.set({state: 'on'});
});

我想运行这个脚本redirect.js

    chrome.storage.sync.get(null, function(obj) {
        if (obj.hasOwnProperty("option")){
            tab = obj.option.split(",");
        if(tab[0]!=='false'){
            AvStreamStart(tab);
            }
        }
    });
function AvStreamStart(tab) {
/* my script here
} 

【问题讨论】:

  • 尚不清楚“扩展程序无需单击扩展程序图标即可开始工作”的确切含义。您想在不单击的情况下运行哪个脚本 - 弹出窗口或背景? 仅供参考:弹出脚本应该仅在单击扩展图标后运行。
  • 感谢您的帮助,我已经编辑了我的问题,所以我想运行redirect.js
  • 所以只需从后台脚本调用它
  • 怎么样!你能给我举个例子吗?再次感谢
  • 如果您不能使用import,另一种解决方案是将redirect.js 添加到清单的“背景”字段或创建包含两个脚本(backgroundredirect)的背景页面。

标签: javascript jquery html google-chrome google-chrome-extension


【解决方案1】:

最简单的方法是将代码从redirect.js 复制粘贴到background.js

但是,如果您想模块化您的代码,您可以在清单的“背景”字段下列出这些脚本,作为“脚本”键后面的数组。

manifest.json:

...
"background": {
    "scripts": [
         "redirect.js",
         "background.js"
    ]
}
...

另一种方法是将后台脚本注册为清单中的 html 页面,并在该 html 中包含所有需要的 JS 脚本。

manifest.json:

...
"background": {
    "page": "background.html"
}
...
...

background.html:

<script type="text/javascript" src="redirect.js"></script>

<script type="text/javascript" src="background.js"></script>

【讨论】:

  • 感谢您的帮助
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2016-11-08
  • 1970-01-01
  • 1970-01-01
  • 2016-07-04
  • 2014-12-04
  • 1970-01-01
  • 2019-10-12
相关资源
最近更新 更多