转贴danheberden的代码
下面的代码能够将Form表单的值转化成一个Javascript对象,觉得在构建Form表单值的对象时代码实现上比较好,故转贴分享一下.
/*
* .serializeObject (c) Dan Heberden
* danheberden.com
*
* Gives you a pretty object for your form elements
*/
(function($){
$.fn.serializeObject = function() {
if ( !this.length ) { return false; }
var $el = this,
data = {},
lookup = data; //current reference of data
$el.find(':input[type!="checkbox"][type!="radio"], input:checked').each(function() {
// data[a][b] becomes [ data, a, b ]
var named = this.name.replace(/\[([^\]]+)?\]/g, ',$1').split(','),
cap = named.length - 1,
i = 0;
for ( ; i < cap; i++ ) {
// move down the tree - create objects or array if necessary
lookup = lookup[ named[i] ] = lookup[ named[i] ] ||
( named[i+1] == "" ? [] : {} );
}
// at the end, psuh or assign the value
if ( lookup.length != undefined ) {
lookup.push( $(this).val() );
}else {
lookup[ named[ cap ] ] = $(this).val();
}
// assign the reference back to root
lookup = data;
});
return data;
};
})(jQuery);
实例
<div id="test">
<input name="text1" value="txt-one" />
<input type="checkbox" name="top[child][]" value="1" checked="checked" />
<input type="checkbox" name="top[child][]" value="2" checked="checked" />
<input type="checkbox" name="top[child][]" value="3" checked="checked" />
<select name="another[select]">
<option value="opt"></option>
</select>
</div>
$( '#test' ).serializeObject();
Returns
{ text1: "txt-one",
top: {
child: [ "1", "2", "3" ]
},
another: {
select: "opt"
}
}
分享到:
相关推荐
本文将介绍如何利用jQuery序列化form表单数据为JSON对象的实现方法,并提供实例代码来加深理解。 在Web开发中,表单提交是一个常见的操作,通常需要把表单中的数据转换成适合网络传输的格式。HTML表单通过表单元素...
`jquery.serializeObject`是一个插件,它扩展了jQuery的核心功能,允许开发者将表单元素的数据序列化为JSON对象,方便进一步处理和传输。这个功能在现代Web应用中非常关键,因为它使得动态数据的收集和发送变得更加...
serializeObject 该jquery插件会将序列化的表单数据数组映射到JSON Object。相依性库。开始导入库。 导入插件。首次使用 $( "form" ).serializeObject();二次使用 var rFormat = {id: 0,name: "John Doe"};$( "form...
总结来说,虽然jQuery本身不提供表单到JSON序列化的直接支持,但是通过结合serializeArray()方法、动态对象属性处理、以及自定义的序列化函数,我们可以实现这一功能。对于嵌套对象的处理特别需要注意属性名的分割和...
标题提到的"jQuery将表单序列化成一个Object对象的实例",主要涉及到jQuery的`serializeArray()`方法和自定义扩展功能,以适应开发者对于更方便的数据结构的需求。 `serializeArray()`是jQuery提供的一个方法,用于...
为了将表单数据以对象的形式传输到服务器,我们常常需要对表单元素进行序列化操作。jQuery库作为一个广泛使用的JavaScript库,提供了方便的方法来简化这一过程。本文将介绍如何使用jQuery来序列化表单为对象形式。 ...
在前端开发中,数据的序列化是一个非常关键的步骤,特别是在表单提交或者与服务器进行交互时。`jQuery.serializeObject` 是一个非常实用的 jQuery 插件,它能够将 HTML 表单的数据转换成 JSON 格式,方便我们处理和...
要将一个C#对象序列化为JSON字符串,可以使用`JsonConvert.SerializeObject()`方法;反序列化则使用`JsonConvert.DeserializeObject()`。 例如: ```csharp using Newtonsoft.Json; public class User { public ...
本项目"前端项目-jquery-serialize-object"关注的是使用jQuery来序列化表单字段,将它们转换为JavaScript对象或JSON格式,这在提交表单数据到服务器时尤其有用。下面我们将深入探讨这一主题。 1. **jQuery 序列化...
1. 序列化对象为JSON:首先,定义一个C#对象,然后使用Json.NET的`JsonConvert.SerializeObject`方法将其转换为JSON字符串。 ```csharp public class MyData { public string Field1 { get; set; } public int ...
在使用easyui的datagrid组件时,在查询时传递的查询参数是对象类型,为了方便,扩展了jquery中的序列化方法,调用该方法,可以将表单的所有数据序列化 $.fn.serializeObject=function(){ var obj=new Object(); ...
为了将序列化后的表单值转换为JSON,我们可以自定义一个jQuery扩展函数,如`serializeObject()`。这个函数的作用是遍历`serializeArray()`返回的数组,并将其构建为一个JSON对象。以下是一个实现这个功能的示例代码...
首先,需要创建一个MultipartFormDataContent对象,然后添加键值对或文件流。例如: ```csharp using System.Net.Http; using System.IO; var client = new HttpClient(); var content = new ...
4. **序列化表单数据为JSON**:jQuery提供`serializeArray()`和`serializeObject()`(非官方插件)方法将表单数据转换为JSON格式,便于发送Ajax请求: ```javascript var formData = $('form').serializeArray();...
// 获取并序列化电话簿数据 return JsonConvert.SerializeObject(phoneBook); } } ``` 在我们的电话簿案例中,客户端可能有一个简单的HTML表单,使用`jQuery.validate`插件进行表单验证。`jQuery.validate`...