Question

我在这个本地存储阵列上遇到了困难。我在这里搜索但无法解决它。希望你能帮我解决这个问题。

这是我的代码。

$(function(){
    var addWishlist = $('.add-wishlist');
    addWishlist.click(function(e){
        e.preventDefault();
        var product_ids = [];
        localStorage.setItem('product_ids', $(this).prev().val() );
        console.log( localStorage.getItem('product_ids') );
    });
});

输出是：

输出应为[2,3,4,1]

Answer 1

您需要在按钮单击时将其添加到阵列，然后将其存储到本地存储。此外，product_ids应在点击事件

之外初始化

var product_ids = [];
addWishlist.click(function(e){
        e.preventDefault();      
        product_ids.push($(this).prev().val())
        localStorage.setItem('product_ids',product_ids );
        console.log(localStorage.getItem('product_ids') );
    });

Answer 2

有一些错误：

数组product_ids始终为空，因为您需要push()或unshift()或其他任何内容来填充数组。
localStorage只能接受字符串，我甚至认为它甚至无法识别您的空数组。

更改

添加了一个额外按钮，可将数据加载到localStorage
输入文本，然后单击添加按钮。
文本输入的值push()已加入数组productList。
每次更新productList时，都会将其存储在隐藏输入#cache
点击完成按钮后，#cache的值将JSON.stringify转换为字符串。
productList为字符串后，会将其存储在localStorage中，并显示在#output中。

由于SO沙箱，代码段不起作用，因此请查看此PLUNKER。

段

＆＃13;

<!DOCTYPE html>
<html>

<head>

</head>

<body>

  <fieldset>
    <legend>wishList</legend>
    <input id='in1'>
    <button><a href='#' id='add'>Add</a>
    </button>
    <button><a href='#' id='done'>Done</a>
    </button>
    <label for='out1'>wishList:</label>
    <output id='out1'></output>
    <input id='cache' type='hidden'>
  </fieldset>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script>
    $(function() {
      var productList = [];
      $('#add').on('click', function(e) {
        e.preventDefault();
        var productItem = $('#in1').val();
        productList.push(productItem);
        $('#cache').val(productList);
      });
      $('#done').on('click', function(e) {
        e.preventDefault();
        var cached = $('#cache').val();
        var str = JSON.stringify(cached);
        localStorage.setItem('proList', str);
        var stored = localStorage.getItem('proList');
        console.log(stored)
        $('#out1').html(stored);
      });
    });
  </script>
</body>

</html>

＆＃13;

添加localstorage数组

2 个答案:

更改

段