javascript - HTML5 LocalStorage重新加载文档

Question

我遇到了这样的问题:我必须向图库添加一些图像，并且在重新加载页面后它们应该仍然存在。我已经成功地做到了这一点，元素被添加到数组中，一切都很好。重新加载文档后，它们也位于本地存储中。但是，重新加载文档并尝试添加其他一些图片后，数组将被覆盖。所以而不是:[img1, image, image, ..., imgn] 我明白再次[imgn, image, img2]。这是我的代码:

<script type="text/javascript">

        $(document).ready(function() {
          var imageList = [];
          $('.addPic').click(function() { 
                 var image = $(this).attr('data-image'); //this variable contains particular image ID
                 imageList.push(image);
                 localStorage.setItem("imageList", JSON.stringify(imageList)); 
          });
        });

</script>

我做错了什么？感谢您的帮助。

Answer 1

在您显示的代码中，您从未使用您声明的存储。因此，您只存储 imageList 数组中当前存在的内容。

您应该通过读取本地存储来声明 imageList :

var imageList = localStorage.getItem("imageList");