0

我试图找出我在使用 JSON 和循环子对象时遇到的问题。我以前从未使用过 JSON，所以如果语法错误导致我的问题，请告诉我。

我定义了这个 JSON 对象：

var columnData = {
    "obj1":{Heading: "Test 1", Required: "True", DataTypeCode:"str", DropDownOptions: "", ColumnId: "1"},
    "obj2":{Heading: "Test 2", Required: "False", DataTypeCode:"dropdown", DropDownOptions: "Alpha,Beta,Gamma,Delta", ColumnId: "2"},
    "obj3":{Heading: "Test 3", Required: "True", DataTypeCode:"int", DropDownOptions: "", ColumnId: "3"}
};

我将它传递给执行此操作的函数：

for (var col in columnData) {
    r += '<td><input type="text" name="col' + col.ColumnId + '" value="' + col.Heading + '" /></td>'
}

FireBug 中的断点确认 columnData 是一个有效对象，它具有三个子对象，并且子对象具有预期的属性和值。但这是调用函数后我得到的输出：

<td><input name="colundefined" value="undefined" type="text"></td>

不幸的是，我认为我缺乏使用 JSON 的经验使得我试图追踪答案的结果无法使用。如何编写一个能正确获取 columnData 子对象的循环？

4

3 回答 3

1

您仍然需要 columnData：

columnData[col].ColumnId
于 2012-05-09T19:28:03.883 回答
1

做这个：

var key;
var col;

for ( key in columnData ) {
    col = columnData[ key ];
    r += '<td><input type="text" name="col' + col.ColumnId + '" value="' + col.Heading + '" /></td>';
}

另外一个选项：

r += Object.keys( columnData ).map( function ( key ) {
    var col = columnData[ key ];
    return '<td><input type="text" name="col' + col.ColumnId + '" value="' + col.Heading + '" /></td>';
}).join( '' );

我还推荐了一个模板引擎（如 Handlebars.js）来满足您的 HTML 字符串连接需求。

于 2012-05-09T19:29:01.747 回答
1

JSON 要求键值用双引号括起来，您的columnData变量是 javascript 对象，而不是 JSON。

话虽这么说，col是columnData被迭代的当前关键，例如obj1，obj2，obj3。如果要访问这些对象之一的属性，则需要先访问它：

var col;
for (var key in columnData) {
    col = columnData[key];
    r += '<td><input type="text" name="col' + col.ColumnId + '" value="' + col.Heading + '" /></td>'
}
于 2012-05-09T19:30:27.500 回答