使用 jquery 使用每个输入值动态创建 JSON
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15009448/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Creating a JSON dynamically with each input value using jquery
提问by BaconJuice
I got a situation where I would like to read some data off a JSON format through PHP, however I am having some issues understanding how I should construct the Javascript object to create the JSON format dynamically.
我遇到了一种情况，我想通过 PHP 从 JSON 格式中读取一些数据，但是我在理解如何构造 Javascript 对象以动态创建 JSON 格式时遇到了一些问题。
My scenario is as follows:
我的情况如下：
<input title="QA" type="text" class="email">
<input title="PROD" type="text" class="email">
<input title="DEV" type="text" class="email">
The Javascript code I have so far goes through each input grabs the data, I am however unable to understand how to process from here on.
到目前为止，我所拥有的 Javascript 代码通过每个输入获取数据，但是我无法理解从这里开始如何处理。
var taskArray = {};
$("input[class=email]").each(function() {
var id = $(this).attr("title");
var email = $(this).val();
//how to create JSON?
});
I would like to get the following output if possible.
如果可能，我想获得以下输出。
[{title: QA, email: '[email protected]'}, {title: PROD, email: '[email protected]'},{title: DEV, email: '[email protected]'}]
Where the email is acquired by the input field value.
其中通过输入字段值获取电子邮件。
回答by ATOzTOA
Like this:
像这样：
function createJSON() {
jsonObj = [];
$("input[class=email]").each(function() {
var id = $(this).attr("title");
var email = $(this).val();
item = {}
item ["title"] = id;
item ["email"] = email;
jsonObj.push(item);
});
console.log(jsonObj);
}
Explanation
解释
You are looking for an array of objects. So, you create a blank array. Create an object for each inputby using 'title' and 'email' as keys. Then you add each of the objects to the array.
您正在寻找an array of objects. 因此，您创建了一个空白数组。input使用“title”和“email”作为键为每个对象创建一个对象。然后将每个对象添加到数组中。
If you need a string, then do
如果你需要一个字符串，那么做
jsonString = JSON.stringify(jsonObj);
Sample Output
样本输出
[{"title":"QA","email":"a@b"},{"title":"PROD","email":"b@c"},{"title":"DEV","email":"c@d"}]
回答by ChrisF
I don't think you can turn JavaScript objects into JSON strings using only jQuery, assuming you need the JSON string as output.
我认为您不能仅使用 jQuery 将 JavaScript 对象转换为 JSON 字符串，假设您需要 JSON 字符串作为输出。
Depending on the browsers you are targeting, you can use the JSON.stringifyfunction to produce JSON strings.
根据您的目标浏览器，您可以使用该JSON.stringify函数生成 JSON 字符串。
See http://www.json.org/js.htmlfor more information, there you can also find a JSON parser for older browsers that don't support the JSON object natively.
有关更多信息，请参阅http://www.json.org/js.html，您还可以在那里找到适用于本机不支持 JSON 对象的旧浏览器的 JSON 解析器。
In your case:
在你的情况下：
var array = [];
$("input[class=email]").each(function() {
array.push({
title: $(this).attr("title"),
email: $(this).val()
});
});
// then to get the JSON string
var jsonString = JSON.stringify(array);
回答by Salman
May be this will help, I'd prefer pure JS wherever possible, it improves the performance drastically as you won't have lots of JQuery function calls.
可能这会有所帮助，我希望尽可能使用纯 JS，它可以显着提高性能，因为您不会有很多 JQuery 函数调用。
var obj = [];
var elems = $("input[class=email]");
for (i = 0; i < elems.length; i += 1) {
var id = this.getAttribute('title');
var email = this.value;
tmp = {
'title': id,
'email': email
};
obj.push(tmp);
}
回答by Pravin
same from above example - if you are just looking for json (not an array of object) just use
与上面的示例相同 - 如果您只是在寻找 json（不是对象数组），请使用
function getJsonDetails() {
item = {}
item ["token1"] = token1val;
item ["token2"] = token1val;
return item;
}
console.log(JSON.stringify(getJsonDetails()))
this output ll print as (a valid json)
此输出将打印为（有效的 json）
{
"token1":"samplevalue1",
"token2":"samplevalue2"
}
