Javascript Stringify对象

Question

我正在以Ajax形式使用MVC 5和Select2插件。

Chrome控制台中的对象如下所示：http://i.imgur.com/0dFFxkB.jpg （更容易将对象显示为图片）

我想要的是提取ID和文本并将其保存到我的数据库中。作为字符串化对象。注意到很多其他只保存ID /值的解决方案，然后向文本的数据包往返。 但我想只是对对象进行字符串化，只保存id和文本，然后在页面加载时将对象从隐藏字段序列化回Select2框。

当我尝试使用JSON.stringify方法时，我收到错误：

  

未捕获的InvalidStateError：无法读取＆＃39; selectionDirection＆＃39;属性来自＆＃39; HTMLInputElement＆＃39;：输入元素的类型（＆＃39;隐藏＆＃39;）不支持选择。

Answer 1

由于您只想保存id和文本，因此可以从对象中删除其余字段，这也会消除数据库中的混乱：

var selectedObjects = $('#GeoList').select2('data');
var dataToSave = []
$.each(selectedObjects, function(index, obj) {
    dataToSave.push({ "id" : obj.id, "text" : obj.text});
});
var result = JSON.stringify(dataToSave);

对象中的element字段似乎是一个HTML元素，其中包含许多您不需要的额外状态信息。

我不确定为什么会在这种情况下发生这种情况，但这里也是一个类似的问题：Why can't you stringify a jQuery object?

Answer 2

JSON.stringify的ECMAScript规范指定了将对象的属性列表获取为JSONify的行为：

  

让 K 成为一个内部字符串列表，其中包含[[Enumerable]]属性为true的所有值属性的名称。字符串的顺序应与Object.keys标准内置函数使用的顺序相同。

因此我们知道JSON.stringify尝试包含对象的所有可枚举属性，其中包括Object.keys中命名的所有属性。对于DOM对象（Firefox中除外，whose DOM elements have no properties of their own），其中包含属性selectionDirection，该属性在从<input type="button>元素读取时会引发错误。

Ninsly's answer解释了为什么这是一个糟糕的方法，并提出了一个更好的方法：只需挑选你需要的实际值，而不是串联大量有关DOM元素状态的无关数据。

Answer 3

由于它已在其他浏览器中运行，因此这可能是一个错误，您可以进一步报告它以获得您需要的反馈。

否则，您可以通过自己创建一个Object来获取与对象相关的属性（ id / text ），然后对其进行字符串化，从而获得更广泛的浏览器兼容解决方案：

var geoList = $('#GeoList').select2('data');
var toStoreList = [];
$.each(geoList, function(key, val) {
  toStoreList.push({ "id" : val.id, "text" : val.text});
});

然后调用Array对象JSON.stringify上的toStoreList方法。