8

我正在尝试遍历许多项目，并创建一个 json 对象。每个循环都应该是对象上的一个新项目，但我在做这件事时遇到了一些问题。似乎只添加了一组项目，而不是多个项目。

这是我的代码：

jsonObj = {}
rows.each(function (index) {
    jsonObj["id"] = $this.find('.elementOne').val();
    jsonObj["name"] = $this.find('.elementTwo').text();

});

这是我的 json 的样子：

{
    id: "3"
    name: "Stuff"
},

这是我正在尝试做的事情：

{
    id: "1"
    name: "Stuff"
},
{
    id: "2"
    name: "Stuff"
},
{
    id: "3"
    name: "Stuff"
}
4

6 回答 6

28

这里没有 JSON。请不要混淆：

  • JavaScript 对象（一种数据结构）
  • JavaScript 对象字面量（创建此类数据结构的代码）
  • JSON（一种基于对象文字符号子集的数据格式）

如果您想要一个有序的对象列表（或任何其他类型的 JavaScript 数据结构），请使用数组。数组有一个push方法。

var myData = [];
rows.each(function (index) {
    var obj = { 
        id: $this.find('.elementOne').val(),
        name: $this.find('.elementTwo').text()
    };
    myData.push(obj);
});
于 2012-06-30T22:34:11.093 回答
5

您覆盖该对象，而不是每次迭代都为其添加一个新值。

使用数组的固定代码：

jsonObj = [];
rows.each(function(index) {
    jsonObj.push({
        'id': $this.find('.elementOne').val(),
        'name': $this.find('.elementTwo').text()
    });
});​
于 2012-06-30T22:34:03.777 回答
4

你想要的是一个对象数组。当您尝试在同一个对象上多次写入相同的属性时，它会被覆盖，这就是您看到id并name包含循环最后一次迭代的值的原因。

虽然您没有使用 jQuery 标记问题，但它看起来确实像 jQuery，所以这里有一个解决方案：

我冒昧地更改$this为，this因为$this似乎在每次迭代中都指的是同一个对象，这就是你现在可能想要的（我认为）

var myArray = rows.map(function() {
    return {
        id: $(this).find('.elementOne').val(),
        name: $(this).find('.elementTwo').text()
    };
});
于 2012-06-30T22:35:08.817 回答
3

您可以使用 jquery 来执行此操作。该函数将期望输入类型的表单元素。它将遍历传递的表单，它将收集每个输入名称和值，并将创建一个 json 对象，如

示例：

HTML

<form action="" method="post" id="myForm">
    <input type="text" name="field1" value="I am value of field 1"/>
    <input type="text" name="field2" value="I am value of field 2"/>
</form>

Javascript

function buildObject(form) {
            var jsonObject = [],
                tempObj = {};
            $(form).find("input:not(input[type='submit'])").each(function() {
                tempObj[$(this).attr("name")] = $(this).val();
            });

            jsonObject.push(tempObj);

            return jsonObject[0];
    }
    buildObject($("#myForm"));
    //Will produce

     jsonObj = {
        field1 : "I am value of field 1",
        field2 : "I am value of field 2"    
    }
于 2015-08-31T13:10:27.607 回答
2

这是因为您只是覆盖了对象的相同属性，id并且name，每次。您需要为每个子对象创建一个子对象，然后将其推送到主对象中（我已将其转换为数组，因为它是非关联的）。

var jsonObj = []
rows.each(function (index) {
    var temp_obj = {};
    temp_obj["id"] = $this.find('.elementOne').val();
    temp_obj["name"] = $this.find('.elementTwo').text();
    jsonObj.push(temp_obj);
});

[编辑] - 正如 Mark Eirich 的回答所示，这temp_obj是不必要的 - 你可以推送一个匿名对象，但我定义temp_obj只是为了让发生的事情一目了然。

另请阅读 Quentin 的非常好的观点：JavaScript 对象和 JSON 之间的常见混淆。

于 2012-06-30T22:34:23.763 回答
1 
var jsonObj = [];
rows.each(function(index) {
    jsonObj.push({
        id: $this.find('.elementOne').val(),
        name: $this.find('.elementTwo').text()
    });
});
于 2012-06-30T22:33:50.720 回答