javascript - 将值恢复到 tokeninput 字段 - jquery 错误

Question

我正在尝试从 tokeninput 字段获取值，将它们保存到本地存储，然后稍后检索它们。我收到错误。代码:

//Save to storage
 var selectedValues = $('#Contacts').tokenInput("get");
console.log(JSON.stringify(selectedValues));
localStorage.setItem('ContactsJSON', JSON.stringify(selectedValues));

//Restore
var names = localStorage.getItem("ContactsJSON");
console.log(names);
$.each(names, function (index, value) {
    $("#Contacts").tokenInput("add", value);
});

错误消息是:

Invalid operand to 'in': Object expected

jquery-1.10.2.js (1009,2) 处显示错误

我很确定我的 JSON 是正确的，根据 tokeninput docs ，使用 get API 检索时它应该采用正确的格式:

selector.tokenInput("get");
从 tokeninput 获取所选标记的数组(每个项目都是 {id: x, name: y} 类型的对象)。

我在localstorage中可以看到的数据如下:

[{id":59,"name":"史蒂夫·卡雷尔"},{"id":58,"name":"约翰·卡拉辛斯基"},{"id":1,"name":“珍娜·费舍尔”}]

Answer 1

我相信你的问题是你得到的是字符串，而不是对象。

您应该对本地存储中的字符串调用 JSON.pase()。

因此，固定代码应如下所示:

// here you are converting object to string:
localStorage.setItem('ContactsJSON', JSON.stringify(selectedValues));

var names = localStorage.getItem("ContactsJSON");
// here you should convert string back to object
var names_object = JSON.parse(names);
console.log(names_object);
$.each(names_object, function (index, value) {
    $("#Contacts").tokenInput("add", value);
});