jquery.param()实现数组或对象的序列化方法

jQuery.param( obj )：

创建适用于URL查询字符串或Ajax请求的数组，普通对象或jQuery对象的序列化表示形式。 如果jQuery对象被传递，它应该包含具有name / value属性的输入元素。

jQuery.param( obj )：

obj：

类型：Array或PlainObject或jQuery
 一个数组，一个普通的对象，或一个jQuery对象进行序列化。
 jQuery.param( obj, traditional )：

obj：

类型：Array或PlainObject或jQuery
 一个数组，一个普通的对象，或一个jQuery对象进行序列化。

traditional ：

 类型：布尔值
 一个布尔值，表示是否执行传统的“浅”序列化。

内部使用此函数将表单元素值转换为序列化字符串表示形式（有关更多信息，请参阅.serialize（））。

从jQuery 1.3开始，使用函数的返回值代替函数作为String。

从jQuery 1.4开始，$ .param（）方法递归序列化深层对象，以适应现代脚本语言和框架，如PHP和Ruby on Rails。

您可以通过设置jQuery.ajaxSettings.traditional = true来全局禁用此功能。从jQuery 3.0开始，$ .param（）方法不再使用jQuery.ajaxSettings.traditional作为其默认设置，默认为false。

为了跨版本的最佳兼容性，请调用$ .param（）和第二个参数的显式值，并且不要使用默认值。如果传递的对象在数组中，则它必须是由.serializeArray（）返回的格式的对象数组。

[
 { name: "first", value: "Rick" },
 { name: "last", value: "Astley" },
 { name: "job", value: "Rock Star" }
]

注意：由于某些框架解析序列化数组的能力有限，因此开发人员在传递包含嵌套在另一个数组中的对象或数组的obj参数时应谨慎。

注意：由于没有普遍约定的param字符串规范，所以不可能以支持此类输入的所有语言的理想方式对使用此方法的复杂数据结构进行编码。 使用JSON格式替代编码复杂数据。

在jQuery 1.4中，HTML5输入元素也被序列化。我们可以显示一个对象的查询字符串表示形式和一个URI解码版本，如下所示：

var myObject = {
 a: {
 one: 1,
 two: 2,
 three: 3
 },
 b: [ 1, 2, 3 ]
};
var recursiveEncoded = $.param( myObject );
var recursiveDecoded = decodeURIComponent( $.param( myObject ) );
alert( recursiveEncoded );
alert( recursiveDecoded );

shallowEncoded和shallowDecoded的值弹出如下： 

a=%5Bobject+Object%5D&b=1&b=2&b=3
a=[object+Object]&b=1&b=2&b=3

举例：

序列化一个键/值对象。

<!doctype html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <title>jQuery.param demo</title>
 <style>
 div {
 color: red;
 }
 </style>
 <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<div id="results"></div>

<script>
var params = { width:1680, height:1050 };
var str = jQuery.param( params );
$( "#results" ).text( str );
</script>

</body>
</html>

演示：

序列化一些复杂的对象

// <=1.3.2:
$.param({ a: [ 2, 3, 4 ] }); // "a=2&a=3&a=4"
// >=1.4:
$.param({ a: [ 2, 3, 4 ] }); // "a[]=2&a[]=3&a[]=4"

// <=1.3.2:
$.param({ a: { b: 1, c: 2 }, d: [ 3, 4, { e: 5 } ] });
// "a=[object+Object]&d=3&d=4&d=[object+Object]"

// >=1.4:
$.param({ a: { b: 1, c: 2 }, d: [ 3, 4, { e: 5 } ] });
// "a[b]=1&a[c]=2&d[]=3&d[]=4&d[2][e]=5"

以上这篇jquery.param()实现数组或对象的序列化方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • jQuery将表单序列化成一个Object对象的实例

    验证表单的时候经常需要获取表单中name='***'的元素的值,然后加以判断.jQuery中提供了jQuery.serizlizeArray来将表单序列化成一个数组.尽管如此,数组还是不方便我们操作,我需要讲表单序列化成一个对象.这样更方便于我们操作.   下面是代码: /** * @author gaohuia */ (function($){ $.fn.extend({ serializeObject:function(){ if(this.length>1){ return false;

  • jquery序列化方法实例分析

    本文实例讲述了jquery序列化方法.分享给大家供大家参考.具体分析如下: 做ajax的时候,经常需要序列化, serialize()只能序列化表单 .(注 : 表单里的内容 只能用 name ) 现在有一个对象: 复制代码 代码如下: var obj={a:1,b:2,c:3}; 怎么让它序列化呢? 用prototype 可以用$H(obj).toQueryString() 搞定?jqueyr有什么方法吗? 答案是肯定的, jquery提供了 $.param(). var obj={a:1,b

  • jQuery序列化form表单数据为JSON对象的实现方法

    jquery提供的serialize方法能够实现. $("#searchForm").serialize(); 但是,观察输出的信息,发现serialize()方法做的是将表单中的数据以htpp请求格式拼接成字符串. serialize确实是能够解决一般的提交数据.但是有时我们需要的是一个object对象,而不是字符串(比如jqgrid reload时设置查询条件参数,就需要object对象). 方法如下: (function(window, $) { $.fn.serializeJs

  • JQuery中serialize() 序列化

    本文导读:在jQuery中,当我们使用ajax时,常常需要拼装input数据以键值对(Key/Value)的形式发送到服务器,用JQuery的serialize方法可以轻松的完成这个工作,使用这个方法可以将表单序列化为键值对(key1=value1&key2=value2-)后提交.下面介绍JQuery中serialize()的用法 一.serialize()定义和用法: serialize()方法通过序列化表单值,创建标准的URL编码文本字符串,它的操作对象是代表表单元素集合的jQuery 对

  • 利用jQuery操作对象数组的实现代码

    jQuery对于数组元素操作主要提供了以下工具: (1)数组和对象的例遍:jQuery.each(obj,callback) 通用例遍方法,可用于例遍对象和数组.回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容.如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略. (2)数组元素的过滤:jQuery.grep(array,callback,[invert]) 使用过滤函数过滤数组元素.此函数至少传递两个参数:待过滤数组和过滤函数.过滤函数必须

  • jQuery序列化表单成对象的简单实现

    在使用easyui的datagrid组件时,在查询时传递的查询参数是对象类型,为了方便,扩展了jquery中的序列化方法,调用该方法,可以将表单的所有数据序列化 $.fn.serializeObject=function(){ var obj=new Object(); $.each(this.serializeArray(),function(index,param){ if(!(param.name in obj)){ obj[param.name]=param.value; } }); r

  • jquery form表单序列化为对象的示例代码

    复制代码 代码如下: $.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { if (o[this.name]) { if (!o[this.name].push) { o[this.name] = [ o[this.name] ]; } o[this.name].push(this.value || ''); } else { o[this.nam

  • jquery.param()实现数组或对象的序列化方法

    jQuery.param( obj ): 创建适用于URL查询字符串或Ajax请求的数组,普通对象或jQuery对象的序列化表示形式. 如果jQuery对象被传递,它应该包含具有name / value属性的输入元素. jQuery.param( obj ): obj: 类型:Array或PlainObject或jQuery 一个数组,一个普通的对象,或一个jQuery对象进行序列化. jQuery.param( obj, traditional ): obj: 类型:Array或PlainOb

  • JS中数组与对象的遍历方法实例小结

    本文实例讲述了JS中数组与对象的遍历方法.分享给大家供大家参考,具体如下: 一.数组的遍历: 首先定义一个数组 arr=['snow','bran','king','nightking']; 1.for循环,需要知道数组的长度; 2.foreach,没有返回值,可以不知道数组长度: arr.forEach(function(ele,index){ console.log(index); console.log(ele) }) 3.map函数,遍历数组每个元素,并回调操作,需要返回值,返回值组成新

  • js一维数组、多维数组和对象的混合使用方法

    这篇文章的主要目的是讲解JavaScript数组和对象的混合使用,由于JS的弱检查特性,因此在JS数组中可以同时存储不同类型的变量,比如你可以把数字.字符串.字符.对象等内容放在同一个数组中.对象也可以做同样的事情,区别是对象可以指定对象里每一个成员的别名,这样在编程的时候数据更易读,比如: var arr1 = ["飞鱼", 25, 172, "江苏"]; var person = {name:"飞鱼",age: 25, height:172,

  • Jquery操作js数组及对象示例代码

    贴一段jQuery对js对象及数组的操作:增删改查的代码. 复制代码 代码如下: var WorkList = new Array();//数组对象 //下面是自己定义的实体 function WorkEx(depart, title, begintime, endtime) {     this.SId = 0;     this.Id = -(WorkList.length+1);     this.DepartmentName = depart;     this.Title = titl

  • jquery获取当前点击对象的value方法

    例:获取ul中li的value值 首先,在html中我们要为每个li设置value值 复制代码 代码如下: <ul> <li value="你好"></li> <li value="hello"></li> <li value="=-="></li> </ul> 再通过jquery根据点击事件获取对应的value 复制代码 代码如下: $(docume

  • JS数组及对象遍历方法代码汇总

    文中的范例基于以下数组和对象. var arrTmp = ["value1","value2","value3"]; var objTmp = { aa:"value1", bb:"value2", cc:function(){ console.log("value3") } } 一.JS原生方法 1. javascript遍历的常用的遍历方法是for循环和for-in,ES5的时候加上

  • jquery遍历筛选数组的几种方法和遍历解析json对象

    jquery grep()筛选遍历数组 复制代码 代码如下: $().ready( function(){ var array = [1,2,3,4,5,6,7,8,9]; var filterarray = $.grep(array,function(value){ return value > 5;//筛选出大于5的 }); for(var i=0;i<filterarray.length;i++){ alert(filterarray[i]); } for (key in filtera

  • Jquery遍历筛选数组的几种方法和遍历解析json对象,Map()方法详解以及数组中查询某值是否存在

    Jquery遍历筛选数组的几种方法和遍历解析json对象,Map()方法详解以及数组中查询某值是否存在

    1.jquery grep()筛选遍历数组(可以得到反转的数组) // 1.jquery grep()筛选遍历数组(可以得到反转的数组) var array = [1,5,9,3,12,4,48,98,4,75,2,10,11]; var filterArray = $.grep(array,(currentValue) => { return currentValue > 10; }); console.log(`${filterArray}---${filterArray.length}`

  • JavaScript 引用类型实例详解【数组、对象、严格模式等】

    本文实例讲述了JavaScript 引用类型.分享给大家供大家参考,具体如下: 数组 在ECMAScript中数组是非常常用的引用类型 ECMAScript所定义的数组和其他语言中的数组有着很大的区别 数组也是一种对象 创建数组 //方法一 var arr = new Array(); //方法二 var arr1 = []; 特点 数组即一组数据的集合 js数组更加类似java的map容器.长度可变,元素类型任意 数组长度随时可变!随时可以修改!(length属性) var arr1 = [1

随机推荐