如何用循環建立json對象？

Question

我想通過一些項目循環，並創建一個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" 
} 

Answer 1

這裏沒有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); 
}); 

Answer 2

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

Answer 3

您重寫該對象，而不是每次迭代都爲其添加一個新值配給。使用

固定碼數組：

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

Answer 4

這是因爲你只是覆蓋你的對象，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); 
}); 

[編輯] - 馬克愛立許的回答顯示，temp_obj是不必要的 - 你可以推一個匿名的對象，而不是，但我定義temp_obj只是爲了讓晶瑩剔透發生了什麼。

同時閱讀昆汀的非常好的觀點：JavaScript對象和JSON之間常見的混淆。

Answer 5

你想要的是一個對象數組。當您嘗試在同一對象上多次寫入相同的屬性時，它會被覆蓋，這就是爲什麼您會看到id和name包含循環最後一次迭代的值。

雖然你還沒有標記與jQuery的問題，它看起來像jQuery的，所以這裏的一個解決方案：

我冒昧改變$this到this因爲$this似乎是指同一對象在每個迭代中，現在你可能想要（methinks）

var myArray = rows.map(function() { 
    return { 
     id: $(this).find('.elementOne').val(), 
     name: $(this).find('.elementTwo').text() 
    }; 
}); 

Answer 6

你可以這樣做，用jQuery。該函數將期望類型輸入的表單元素。它會遍歷到傳遞的形式將收集每個輸入名稱和值，它會創建一個JSON對象像

Exmple：

HTML

<form action="" method="post" id="myForm"> 
    <input type="text" name="field1" value="I a value of field 1"/> 
    <input type="text" name="field2" value="I a 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 a value of field 1", 
     field2 : "I am value of field 2"  
    }