使用 jquery 为每个输入值动态创建 JSON

Question

我遇到了一种情况，我想通过 PHP 从 JSON 格式中读取一些数据，但是我在理解如何构造 Javascript 对象以动态创建 JSON 格式时遇到了一些问题。

我的场景如下：

<input title="QA" type="text" class="email">
<input title="PROD" type="text" class="email">
<input title="DEV" type="text" class="email">

到目前为止，我通过每个输入获取数据的 Javascript 代码，但是我无法理解如何从这里开始处理。

var taskArray = {};

$("input[class=email]").each(function() {
  var id = $(this).attr("title");
  var email = $(this).val();

  //how to create JSON?

});

如果可能，我希望得到以下输出。

[{title: QA, email: 'a@a.com'}, {title: PROD, email: 'b@b.com'},{title: DEV, email: 'c@c.com'}]

通过输入字段值获取电子邮件的位置。

Answer 1

与上面的示例相同 - 如果您只是在寻找 json（不是对象数组），只需使用

function getJsonDetails() {
      item = {}
      item ["token1"] = token1val;
      item ["token2"] = token1val;
      return item;
}
console.log(JSON.stringify(getJsonDetails()))

此输出将打印为（有效的 json）

{ 
   "token1":"samplevalue1",
   "token2":"samplevalue2"
}

Answer 2

假设您需要 JSON 字符串作为输出，我认为您不能仅使用 jQuery 将 JavaScript 对象转换为 JSON 字符串。

根据您的目标浏览器，您可以使用JSON.stringify 函数生成 JSON 字符串。

有关更多信息，请参阅http://www.json.org/js.html，您还可以在其中找到适用于原生不支持 JSON 对象的旧浏览器的 JSON 解析器。

在你的情况下：

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);

Answer 3

这可能会有所帮助，我希望尽可能使用纯 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);
}

Answer 4

像这样：

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);
}

说明

您正在寻找an array of objects。因此，您创建了一个空白数组。使用 'title' 和 'email' 作为键，为每个 input 创建一个对象。然后将每个对象添加到数组中。

如果你需要一个字符串，那么做

jsonString = JSON.stringify(jsonObj);

样本输出

[{"title":"QA","email":"a@b"},{"title":"PROD","email":"b@c"},{"title":"DEV","email":"c@d"}]