Question

无法将项目推送到 localStorage 中的数组中

2014-01-27

2057

javascript html

我有一个 localStorage ，用于保存用户已购票的电影列表。我为此创建了一个数组。问题是我无法将新值推送到 localStorage 中的此数组。

代码：

if(window.localStorage){
    if(localStorage.getItem('movies_list')){
        var movies_list = localStorage.getItem('movies_list');
        console.log("Movies List: " + localStorage.getItem('movies_list'));
        var movie = $("#movie_name").val();
        movies_list.push(movie);  // Error here
        localStorage.setItem('movies_list',movies_list);
    }
    else{
        var movies_list = new Array();
        var movie = $("#movie_name").val();
        movies_list.push(movie);
        localStorage.setItem('movies_list',movies_list);
    }
}

错误：

Uncaught TypeError: Object Movie 1 has no method 'push'

console.log() 始终返回 LIST: Movie 1 ，似乎下一部电影没有被 push 到数组中。

如何将新值推送到数组？

jsFiddle

Answer 1

您从 localStorage 添加/获取的项目是字符串。因此您需要对它们进行 JSON 编码/解码。

localStorage.setItem('movies_list', JSON.stringify(movies_list));

并且

var movies_list = JSON.parse(localStorage.getItem('movies_list'));

http://jsfiddle.net/Kx9R6/1/

Answer 2

localStorage 仅接受和存储字符串，您无法直接保存数组。相反，您可以在保存期间执行 JSON.stringify，在检索期间执行 JSON.parse。

var movies = ["movie1","movie2","movie3"];
//Saving
localStorage.movies_list = JSON.stringify(movies);
//Retrieving
var list = JSON.parse(localStorage.movies_list);
list.push("movie4");