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


Posted in jQuery onOctober 08, 2018

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()实现数组或对象的序列化方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 jQuery
jQuery简单绑定单个事件的方法示例
Jun 10 jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 jQuery
利用jQuery异步上传文件的插件用法详解
Jul 19 jQuery
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
Aug 23 jQuery
jquery写出PC端轮播图实例
Jan 26 jQuery
jQuery 防止相同的事件快速重复触发方法
Feb 08 jQuery
jQuery中常用动画效果函数知识点整理
Aug 19 jQuery
jquery拖拽自动排序插件使用方法详解
Jul 20 jQuery
jQuery中实现text()的方法
Apr 04 jQuery
JQuery的加载和选择器用法简单示例
May 13 jQuery
jQuery插件simplePagination的使用方法示例
Apr 28 jQuery
jQuery实现点击图标div循环放大缩小功能
Sep 30 #jQuery
学习jQuery中的noConflict()用法
Sep 28 #jQuery
jQuery序列化form表单数据为JSON对象的实现方法
Sep 20 #jQuery
jQuery pjax 应用简单示例
Sep 20 #jQuery
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 #jQuery
jQuery 点击获取验证码按钮及倒计时功能
Sep 20 #jQuery
jQuery使用each遍历循环的方法
Sep 19 #jQuery
You might like
Drupal 添加模块出现莫名其妙的错误的解决方法(往往出现在模块较多时)
2011/04/18 PHP
php利用smtp类实现电子邮件发送
2015/10/30 PHP
如何修改yii2.0自带的user表为其它的表
2017/08/01 PHP
JS 两日期相减,获得天数的小例子(兼容IE,FF)
2013/07/01 Javascript
IE下写xml文件的两种方式(fso/saveAs)
2013/08/05 Javascript
javascript scrollTop正解使用方法
2013/11/14 Javascript
浅谈Javascript中匀速运动的停止条件
2014/12/19 Javascript
js实现横向伸展开的二级导航菜单代码
2015/08/28 Javascript
JS采用绝对定位实现回到顶部效果完整实例
2016/06/20 Javascript
JS多文件上传的实例代码
2017/01/11 Javascript
Vue 2.x教程之基础API
2017/03/06 Javascript
Vue + Webpack + Vue-loader学习教程之相关配置篇
2017/03/14 Javascript
Centos6.8下Node.js安装教程
2017/05/12 Javascript
vue 点击按钮增加一行的方法
2018/09/07 Javascript
使用python实现抓取腾讯视频所有电影的爬虫
2019/04/15 Python
python实现给微信指定好友定时发送消息
2019/04/29 Python
解决Pycharm后台indexing导致不能run的问题
2019/06/27 Python
python实现各种插值法(数值分析)
2019/07/30 Python
用python wxpy管理微信公众号并利用微信获取自己的开源数据
2019/07/30 Python
python数据爬下来保存的位置
2020/02/17 Python
Django中Q查询及Q()对象 F查询及F()对象用法
2020/07/09 Python
利用Python将图片中扭曲矩形的复原
2020/09/07 Python
如何用Python 实现全连接神经网络(Multi-layer Perceptron)
2020/10/15 Python
Python 可视化神器Plotly详解
2020/12/26 Python
调用HTML5的Canvas API绘制图形的快速入门指南
2016/06/17 HTML / CSS
雅诗兰黛加拿大官网:Estee Lauder加拿大
2019/07/31 全球购物
精选奢华:THE LIST
2019/09/05 全球购物
机械个人求职信范文
2014/01/24 职场文书
学生个人自我鉴定
2014/03/26 职场文书
中学生学雷锋演讲稿
2014/04/26 职场文书
班级课外活动总结
2014/07/09 职场文书
大学拉赞助协议书范文
2014/09/26 职场文书
中小企业员工手册范本
2015/05/14 职场文书
大学生受助感言
2015/08/01 职场文书
公司团队口号霸气押韵
2015/12/24 职场文书
vue+elementui 实现新增和修改共用一个弹框的完整代码
2021/06/08 Vue.js