Chrome本地存储问题

Chrome local storage problems

本文关键字：问题 存储 Chrome      更新时间：2023-09-26

我试图使chrome扩展的默认弹出作为设置页面

目前为止的代码

[Manifest.json] 

{
    "name" : "test",
    "description" : "it just works",
    "version" : "1.0",
    "manifest_version" : 2,
    "permissions": [
        "activeTab",
        "declarativeContent",
        "storage"
    ],
    "icons": {
        "16"  : "icon_016.png"
    },
    "options_page": "options.html",
    "content_scripts": [
        {
            "matches": [""],
            "js": ["jquery.js", "script.js"]
        }
    ],
    "background": {
        "scripts": ["background.js","options.js"],
        "persistent": false
    },

    "browser_action":{
        "default_icon": "icon_016.png",
        "default_popup": "popup.html"
    }
}
[popup.html] 

    <!DOCTYPE html>
<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title></title>
    <base target="_blank" />
    <script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='jquery-ui.min.js'></script>
<script src='spectrum.js'></script>
<link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<link rel='stylesheet' href='spectrum.css' />
    <script type="text/javascript" src="options.js"></script>
    <style type='text/css'>
        body {
            width: 300px;
            height: 50px;
        }
        .bc {
            text-align: center;
            height: 60px;
        }
    </style>
</head>
<body onload="loadOptions()">
    <div class="bc container well">
                                <div class="input-group-addon">Refresh time (s)</div>
                                <input class="input" type="number" id="refresh">
                                    <br /><br />
                                <div class="input-group-addon">Max Buy</div>
                                <input class="input" type="number" id="maxBuy">
                                    <br /><br />
                                <div class="input-group-addon">Min Buy</div>
                                <input class="input" type="number" id="minBuy">
                                    <br /><br />
                                <div class="input-group-addon">Buy at (%) discount</div>
                                <input class="input" type="number" id="discount">
                                    <br /><br />
                                <button onclick="saveOptions()">Save</button>
                                    <br />
                                <button onclick="eraseOptions()">Restore default</button>
    </div>
</body>
</html>
[options.js] 

var defmax = 999999;
var defmin = 0;
var defdisc = 30;
var defref = 10;

function loadOptions() {
   var maxBuy = localStorage["maxBuy"];
   var minBuy = localStorage["minBuy"];
   var discount = localStorage["discount"];
   var refresh = localStorage["refresh"];

    // value is not void/null
    if (maxBuy == undefined) {
        maxBuy = defmax;
    }
    if (minBuy == undefined) {
        minBuy = defmin;
    }
    if (discount == undefined) {
        discount = defdisc;
    }
    if (refresh == undefined) {
        refresh = defref;
    }
}

function saveOptions() {
   var select1 = document.getElementById("maxBuy").value;
   var select2 = document.getElementById("minBuy").value;
   var select3 = document.getElementById("discount").value;
   var select4 = document.getElementById("refresh").value;
    localStorage["maxBuy"] = select1;
    localStorage["minBuy"] = select2;
    localStorage["discount"] = select3;
    localStorage["refresh"] = select4;
     chrome.storage.sync.set({
           maxBuy: $('#maxBuy').val(),
           minBuy: $('#minBuy').val(),
           discount: $('#discount').val(),
           refresh: $('#refresh').val()
        });
}

function eraseOptions() {
    localStorage.removeItem("maxBuy");
    localStorage.removeItem("minBuy");
    localStorage.removeItem("discount");
    localStorage.removeItem("refresh");
    location.reload();
}

这个想法是默认弹出工作作为一个设置页面，不用说，它应该显示当前设置的值，你应该能够改变他们。请记住，我是新手，这只是一堆来自各种项目的代码，任何指针都会受到赞赏。

问题是为什么它不工作，它不保存值，也不显示默认值当你打开弹出

你必须像

那样存储
localStorage.setItem("lastname", "Arun");
localStorage.getItem("lastname");
相关文章：