参数序列化$.param()

举例:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
personObj = new Object();
personObj.firstname = "John";
personObj.lastname = "Doe";
personObj.age = 50;
personObj.eyecolor = "blue";
$("button").click(function(){
$("div").text($.param(personObj));
});
});
</script>
</head>
<body> <button>Serialize object</button> <div></div> </body>
</html>

上述返回的结果是:firstname=John&lastname=Doe&age=50&eyecolor=blue

$.param将对象或者数组序列化,序列化的值可以用于AJAX请求时的URL查询字符串

$.param(object,trad)
Parameter Description
object 必须,指定一个要被序列化的对象亦或数组
trad

可选,是否使用传统的参数序列化模式,默认false,注意要在jQuery1.4以上才能使用

$(document).ready(function(){
personObj ={
          a: {
            one: 1,
            two: 2,
            three: 3
            },
          b: [ 1, 2, 3 ]
        }
$("button").click(function(){
document.body.innerHTML=(decodeURIComponent($.param(personObj,true)));
});
});

上述传统序列化显示的结果是:a=[object+Object]&b=1&b=2&b=3

如果是

 $("div").text(decodeURIComponent($.param(personObj)));

将true去掉,将成为a[one]=1&a[two]=2&a[three]=3&b[]=1&b[]=2&b[]=3

表单序列化$.serialize()

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("div").text($("form").serialize());
});
});
</script>
</head>
<body> <form action="">
First name: <input type="text" name="FirstName" value="Mickey"><br>
Last name: <input type="text" name="LastName" value="Mouse"><br>
</form> <button>Serialize form values</button>
<div></div>
</body>
</html>

结果是:FirstName=Mickey&LastName=Mouse

$(selector).serialize()

序列化表单值并创建一个编码过的url文本

你可以选择一个或更多的表单元素(比如input和textarea),或者表单元素本身

序列化的值可以被用于在创建一个AJAX请求的时候,组合URL查询字符串

表单序列化$.serializeArray()

将表单元素序列化成对象数组

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
var x = $("form").serializeArray();
console.log(x);
});
});
</script>
</head>
<body> <form action="">
First name: <input type="text" name="FirstName" value="Mickey"><br>
Last name: <input type="text" name="LastName" value="Mouse"><br>
</form> <button>Serialize form values</button>
<div id="results"></div>
</body>
</html>

控制台输出的结果是

语法格式为:

$(selector).serializeArray()

jQuery ajax序列化函数的更多相关文章

  1. jQuery Ajax 操作函数及deferred对象

    jQuery Ajax 操作函数 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数 描述 jQuery.ajax() 执行异步 H ...

  2. jQuery Ajax 操作函数

    jQuery Ajax 操作函数 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数 描述 jQuery.ajax() 执行异步 H ...

  3. JQ-jQuery-Ajax:jQuery Ajax 操作函数

    ylbtech-JQ-jQuery-Ajax:jQuery Ajax 操作函数 1.返回顶部 1. jQuery Ajax 操作函数 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允 ...

  4. jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法

    jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法   在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们 ...

  5. jQuery Ajax 操作函数 (七)

    函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求. .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxE ...

  6. springboot统一ajax返回数据格式,并且jquery ajax success函数修改

    服务端代码: package com.zhqn.sc.cfg; import org.springframework.core.MethodParameter; import org.springfr ...

  7. jquery ajax error函数详解

    代码:$(document).ready(function() {            jQuery("#clearCac").click(function() {        ...

  8. jquery ajax error函数和及其参数详细说明(转载)

    使用jquery的ajax方法向服务器发送请求的时候,常常需要使用到error函数进行错误信息的处理,本文详细的说明了ajax中error函数和函数中各个参数的用法.一般error函数返回的参数有三个 ...

  9. jquery ajax error 函数的参数及使用

    使用jquery的ajax方法向服务器发送请求的时候,可选的回调函数有success.complete.beforeSend.error函数等.error函数常用来进行错误信息的处理,这里着重提一下e ...

随机推荐

  1. Linux 嵌入式启动以及优化

    转载:http://www.embeddedlinux.org.cn/html/jishuzixun/201312/19-2717.html 第一步: BootLoader -- U boot   1 ...

  2. fastscripT实现权限控制

    fastscripT权限控制 此处以FASTSCRIPT实现功能权限为例,用脚本实现数据权限也是很方便的. unit Unit1; interface uses Winapi.Windows, Win ...

  3. Android gradle 相关配置

    有时候我们需要重命名输出apk文件名,在Android studio 3.0以前我们是这样写的: applicationVariants.all { variant -> variant.out ...

  4. 【sublime text 3】sublime text 3 汉化

    快捷键:Ctrl+Alt+P 输入快捷键Ctrl+Shift+P 在出现的文本框中输入Install Package(或直接输入“ip”)选中packageControl:Install Packag ...

  5. win10安装 迅雷

    下载安装文件所在目录 ,右键,选择以管理员身份运行,输入程序地址,如D:\download\ThunderMini_dl1.5.3.288.exe,回车,这样就出来了程序安装页面,之后就可以就行正常的 ...

  6. EasyMvc入门教程-基本控件说明(9)引言导航

    休息片刻后,继续开工... 这次我们继续学习引言导航,引言导航主要用于知识点的开始,起到知识点导航的作用.直接例子: 实现代码如下: @Html.Q().BlockRef().Title(" ...

  7. Exchange 2013 Database Move to New Partition

    建议不要删除默认数据库,可以通过修改默认数据库名称.路径等实现您的需求. 客戶:The HK Anti-Cancer Society. 要求:遷移數據庫(01)到新分區,實際是遷移成為數據庫(05)  ...

  8. 改进的SMS4算法的差分故障与暴力联合攻击

    改进的SMS4算法的差分故障与暴力联合攻击 (1.中国科学院研究生院,北京100049) 摘要SMS4是在国内正式使用并于2006年发布的第一个用于无线局域网的商用分组password算法.文中研究了 ...

  9. ftp的实现

    ftp.h #define BUFSIZE 512#define CMDSIZE 64#define ARGSIZE 64#define PASSIVE_ON 0x1 struct ftpcmd{ c ...

  10. who命令

    who1.c #include <stdio.h>#include <utmp.h>#include <fcntl.h>#include <unistd.h& ...