Question

我知道这可能是个愚蠢的问题，但我是新手，无法解决这个问题。

这就是我所拥有的：

    <div class="form-group">
  <label for="category">Choose category:</label>
  <select class="form-control" id="category">
    <option>food</option>
    <option>drinks</option>
    <option>bills</option>
    <option>others</option>
  </select>
  <textarea type="text" id="price" class="input-inline"></textarea>
</div>
  <textarea type="text" id="name" class="input-inline"></textarea>
  <div id="DisplayItem"></div>
  <a href="#" data-role="button" onclick="SaveItem()" style="width:120px;margin:auto">Save it</a>
  <a href="#" data-role="button" onclick="DisplayItem()" style="width:150px;margin:auto">Display it</a>

</form>

和脚本：

           function SaveItem() {
    localStorage.setItem("category", jQuery("#category").val());
}

function DisplayItem() {
    jQuery('#DisplayItem').text(localStorage.getItem("category"));


}

使用此代码我将只获得类别，但我想从所有字段获取值。例如，我希望得到如下结果：您的类别为“C”，名称为“N”，价格为“P”。其中C，N和P代表来自公式的值。如何通过一个功能实现它？

谢谢

Answer 1

最佳选择是将所有相关数据作为对象进行管理。

function SaveItem() {
    var item = {
        category: jQuery("#category").val(),
        name: jQuery("#name").val(),
        price: jQuery("#price").val()
    };
    localStorage.setItem("item", JSON.stringify(item)); //JSON.stringify() transforma el objeto en un string en formato JSON para poder guardarlo
}

function DisplayItem() {
    var item = JSON.parse(localStorage.getItem("item")); //JSON.parse() transforma un string en formato JSON un objeto
    var output = "Category: " + item.category + " - Price: " + item.price + " - Name: " + item.name;
    jQuery('#DisplayItem').text(output);

}

Answer 2

本地存储可以存储JavaScript对象，因此假设您有两个类别。

你可以建立一个像这样的对象：

localStorage.setItem('categories', {
   category1: $("#category").val(), category2: $("#category-two").val()
});

请注意，我将jQuery替换为美元符号$，因为它只是jQuery对象的别名，它完全相同，但它是简写。

您可以存储数组

var categories = [];
categories.push($('#category-one').val());
categories.push($('#category-two').val());
localStorage.setItem('categories', categories);

不确定您正在尝试做什么，但您可以通过存储JavaScript对象将多个项目存储在Local Storage API中的一个键下。

如何从localStorage访问多个元素？

2 个答案: