Muszę zapisać stan rozszerzenia. Jeśli jest włączona, kod będzie działać na określonej stronie internetowej, a jeśli nie, to nie będzie.
Nie rozumiem jeszcze, jak to zrobić, ponieważ nie rozumiem tego w pełni.
To jest kod HTML pola wyboru (popup.html):
<div class="onOff">
<label class="switch">
<input id="checkbox" type="checkbox" value="saveValue" />
<span class="slider round" id="theSwitch"></span>
</label>
<span id="onOroff">OFF</span>
</div>
To jest kod jQuery, który zmienia kolor i tekst po kliknięciu przycisku (kolor bg, tekst włączania / wyłączania). Ten kod znajduje się w popup.js :
if ($("#checkbox").is(":checked")) {
$("#onOroff").text("OFF");
$(".slider").css({ "background-color": "#C75052" });
} else {
$("#onOroff").text("ON");
$(".slider").css({ "background-color": "#50c878" });
}
});
Tutaj możesz zobaczyć rozszerzenie:
Kod, który usuwa reklamy, znajduje się w contentEditor.js.
Kiedy klikniesz rozszerzenie i otworzysz je, Chrome widzi to jako kolejną otwieraną stronę, więc kiedy włączam rozszerzenie (klikam Wyłącz) i zamykam okno rozszerzenia, otwieram je ponownie, nie zapisuje tego stanu .
Myślę, że muszę zapisać check / unchecked w zmiennej, przekazać to do chrome.Storage i mieć chrome.storage zapisać ostatnią wersję przycisku.
2 odpowiedzi
Musisz zadeklarować uprawnienia do przechowywania w manifeście
{
"name": "My extension",
...
"permissions": [
"storage"
],
...
}
A następnie użyj go jak
chrome.storage.sync.set({yourValue: true}, function(){});
Ustawić i zdobyć
chrome.storage.sync.get(['yourValue'], function(result){
// your value is in result.yourValue
});
Drugi parametr (funkcja) to wywołanie zwrotne, którego należy użyć, aby wskazać, co dalej zrobić z tymi danymi.
Po zadeklarowaniu uprawnień w pliku manifest.json
{
"name": "My extension",
...
"permissions": [
"storage"
],
...
}
Możesz używać interfejsu API chrome.storage w skryptach zawartości, tła i wyskakujących okienek.
if ($("#checkbox").is(":checked")) {
$("#onOroff").text("OFF");
chrome.storage.local.set({button: 'off'}, function() {
console.log('Button state saved to off');
});
$(".slider").css({ "background-color": "#C75052" });
} else {
$("#onOroff").text("ON");
chrome.storage.local.set({button: 'on'}, function() {
console.log('Button state saved to on');
});
$(".slider").css({ "background-color": "#50c878" });
}});
Będziesz wtedy mieć dostęp do pobrania wartości z pliku background.js, wysyłając żądanie z chrome.storage.
chrome.storage.local.get(['button'], function(result) {
console.log('The button's state is currently ' + result.key);
});
chrome.storage, łatwo jest znaleźć istniejące przykłady przy użyciu witryny takiej jak google.com, oto losowy przykład: link.