使用jquery遍历数组只返回最后一个对象

Question

我是jquery的新手，我认为这只是一个基本问题。 `

<input type="text" name="text1" value=""></input> 
<input type="text" name="text2" value=""></input> 
<input type="text" name="text3" value=""></input> 
<input type="text" name="text4" value=""></input> 
<input type="text" name="text5" value=""></input>  
<input type="submit" value="submit"></input> 
<pre id="result"> 
</pre> 
</form>` 

这是我的HTML形式并且我使用以下的jquery函数来产生JSON对象

$.fn.serializeObject = function() 
{ 
var o = {}; 
var d={}; 
var a = this.serializeArray(); 
$.each(a, function(i,n) { 
o['name'] = n['name']; 
o['content'] =(n['value']); 
}); 
return o; 
};  

$(function() { $('form').submit(function() { $('#result').text(JSON.stringify($('form').serializeObject())); return false; });
});

上运行过程中出现的上述HTML我正的输出{"name":"text5","content":"sdsd"}

只是最终的文本字段。我知道我错了某个地方。有人可以帮我解决它。在此先感谢

Answer 1

这是因为你覆盖对象的属性和最后的值赢，你可以使用一个数组，它的push方法。

$.fn.serializeObject = function() { 
    var o = []; 
    var a = this.serializeArray(); 
    $.each(a, function (i, n) { 
     o.push({ 
      name: n['name'], 
      content: n['value'] 
     }) 
    }); 
    return o; 
}; 

http://jsfiddle.net/kxM3e/

使用jQuery map方法：

$.fn.serializeObject = function() { 
    return this.find('input, textarea, select').map(function(){ 
     return { name: this.name, content: this.value }; 
    }).get(); 
};