关于javascript：在jQuery中序列化为JSON

Serializing to JSON in jQuery

本问题已经有最佳答案，请猛点这里访问。

我需要将对象序列化为JSON。我正在使用jquery。有没有一种"标准"的方法来做到这一点？

我的具体情况：我有一个数组定义如下：

1
2
3
4

var countries = new Array();
countries[0] = 'ga';
countries[1] = 'cd';
...

我需要把它变成一个字符串，这样传递给$.ajax()：

1
2
3
4
5

$.ajax({
type:"POST",
url:"Concessions.aspx/GetConcessions",
data:"{'countries':['ga','cd']}",
...

相关讨论

JSON JS-JavaScript中的JSON。

要将对象转换为字符串，请使用JSON.stringify：

1	var json_text = JSON.stringify(your_object, null, 2);

要将JSON字符串转换为对象，请使用JSON.parse：

1	var your_object = JSON.parse(json_text);

John Resig最近建议：

...PLEASE start migrating
your JSON-using applications over to
Crockford's json2.js. It is fully
compatible with the ECMAScript 5
specification and gracefully degrades
if a native (faster!) implementation
exists.

In fact, I just landed a change in jQuery yesterday that utilizes the
JSON.parse method if it exists, now
that it has been completely specified.

我倾向于相信他在javascript上说的话：)

所有的现代浏览器(以及许多不古老的老浏览器)都支持本地的JSON对象。当前版本的crockford的json库只定义JSON.stringify和JSON.parse，如果它们还没有定义，那么任何浏览器本机实现都是完整的。

相关讨论

我已经使用jquery json 6个月了，它工作得很好。使用非常简单：

1
2
3
4

var myObj = {foo:"bar","baz":"wockaflockafliz"};
$.toJSON(myObj);

// Result: {"foo":"bar","baz":"wockaflockafliz"}

相关讨论

关于IE8+的作品

无需jquery，使用：

1	JSON.stringify(countries);

相关讨论

我没有用过，但你可能想试试马克·吉布森写的jquery插件。

它增加了两个功能：$.toJSON(value)、$.parseJSON(json_str, [safe])。

相关讨论

不，序列化到JSON的标准方法是使用现有的JSON序列化库。如果您不想这样做，那么您必须编写自己的序列化方法。

如果您想了解如何执行此操作的指导，我建议您检查一些可用库的源代码。

编辑：我不会说编写自己的serliation方法是不好的，但是您必须考虑，如果使用格式良好的JSON对您的应用程序很重要，那么您必须权衡"再一次依赖"的开销，以防有一天您的自定义方法可能会遇到一个您没有预料到的失败案例。并入。风险是否可以接受是你的决定。

相关讨论

我在某个地方找到了这个。但不记得在哪里…可能在stackoverflow上：)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

$.fn.serializeObject = function(){
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name]) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};

相关讨论

你在这里找到的：stackoverflow.com/questions/1184624/&hellip；
这实际上并没有将对象序列化为JSON字符串。
@Pyrony-转到网站上的Web表单，在FB控制台中加载jquery代码，然后运行：var data ="" + $.toJSON($('form').serializeObject());。数据现在是一个JSON字符串。然后，运行这个：alert(typeof data);它应该警告"string"。然后运行这个：alert(data);，您应该会看到JSON文本。最后，转到jsonlint.com并粘贴到json字符串中。它应作为Valid JSON进行验证。我不确定我是否理解您的意思，因为所有的东西似乎都指向这个产生有效JSON的地方。再次感谢。

我的服务器上有$.toJSON is not a function ，所以我包括

如果不想使用外部库，可以使用.toSource()本机javascript方法，但它不是完全跨浏览器的。

是的，在调用$.ajax之前，应该先对json.stringify和json.parse您的"json-postdata"。

1
2
3
4
5
6
7
8
9
10
11
12
13

$.ajax({
url: post_http_site,
type:"POST",
data: JSON.parse(JSON.stringify(Json_PostData)),
cache: false,
error: function (xhr, ajaxOptions, thrownError) {
alert(" write json item, Ajax error!" + xhr.status +" error =" + thrownError +" xhr.responseText =" + xhr.responseText );
},
success: function (data) {
alert("write json item, Ajax OK");

}
});

最好的方法是包含json对象的polyfill。

但是，如果您坚持在jquery名称空间内创建一个将对象序列化为json符号(json的有效值)的方法，您可以这样做：

实施

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63

// This is a reference to JSON.stringify and provides a polyfill for old browsers.
// stringify serializes an object, array or primitive value and return it as JSON.
jQuery.stringify = (function ($) {
var _PRIMITIVE, _OPEN, _CLOSE;
if (window.JSON && typeof JSON.stringify ==="function")
return JSON.stringify;

_PRIMITIVE = /string|number|boolean|null/;

_OPEN = {
object:"{",
array:"["
};

_CLOSE = {
object:"}",
array:"]"
};

//actions to execute in each iteration
function action(key, value) {
var type = $.type(value),
prop ="";

//key is not an array index
if (typeof key !=="number") {
prop = '"' + key + '":';
}
if (type ==="string") {
prop += '"' + value + '"';
} else if (_PRIMITIVE.test(type)) {
prop += value;
} else if (type ==="array" || type ==="object") {
prop += toJson(value, type);
} else return;
this.push(prop);
}

//iterates over an object or array
function each(obj, callback, thisArg) {
for (var key in obj) {
if (obj instanceof Array) key = +key;
callback.call(thisArg, key, obj[key]);
}
}

//generates the json
function toJson(obj, type) {
var items = [];
each(obj, action, items);
return _OPEN[type] + items.join(",") + _CLOSE[type];
}

//exported function that generates the json
return function stringify(obj) {
if (!arguments.length) return"";
var type = $.type(obj);
if (_PRIMITIVE.test(type))
return (obj === null ? type : obj.toString());
//obj is array or object
return toJson(obj, type);
}
}(jQuery));

用法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

基本上是两步过程：

首先，你需要像这样穿线

1	var JSON_VAR = JSON.stringify(OBJECT_NAME, null, 2);

之后，需要将字符串转换为对象

1	var obj = JSON.parse(JSON_VAR);

上述解决方案没有考虑的一件事是，如果您有一个输入数组，但只提供了一个值。

例如，如果后端需要一组人员，但在这种特殊情况下，您只需要处理一个人。然后做：

1	<input type="hidden" name="People" value="Joe" />

然后，使用前面的解决方案，它只会映射到如下内容：

1
2
3

{
"People" :"Joe"
}

但它真的应该映射到

1
2
3

{
"People" : ["Joe" ]
}

要解决这个问题，输入应该如下所示：

1	<input type="hidden" name="People[]" value="Joe" />

您将使用以下函数(基于其他解决方案，但扩展了一点)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (this.name.substr(-2) =="[]"){
this.name = this.name.substr(0, this.name.length - 2);
o[this.name] = [];
}

if (o[this.name]) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};