簡體   English   中英

選中的復選框不適用於擴展 chrome

[英]checkbox checked is not working on extension chrome

在擴展安裝時,復選框被選中,但擴展不起作用,擴展開始工作后,用戶點擊擴展圖標,我希望擴展開始工作而不點擊擴展圖標,因為復選框被選中,有人知道如何解決這個問題?

彈出窗口.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>

彈出窗口.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);
}

背景.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復制粘貼到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>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM