参数序列化$.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. Jenkins构建完成后通过SVN Publisher Plugin上传文件到指定的SVN(教程收集)

    SVN Publisher Plugin:https://wiki.jenkins-ci.org/display/JENKINS/SVN+Publisher 构建完成后的文件,比如Maven打的war ...

  2. session再次理解

    1.session介绍: session主要用来存储用户的会话所需的信息(用户行为信息),当用户在同一个服务器上实现不同的操作时,session信息会以变量的形式存储在服务器的内存中,保存用户的状态信 ...

  3. angular md-toast 颜色

    How to show md-toast with background color https://codepen.io/neilkalman/pen/jWBqve <div ng-contr ...

  4. Maven引入本地Jar包并打包进War包中

    1.概述 在平时的开发中,有一些Jar包因为种种原因,在Maven的中央仓库中没有收录,所以就要使用本地引入的方式加入进来. 2. 拷贝至项目根目录 项目根目录即pom.xml文件所在的同级目录,可以 ...

  5. ruby简单的基础 4

    后缀标点符号 =结尾假设方法名字以=结尾的,那么在调用此方法时能够省略这个=. ?结尾作为一个实用惯例,那些返回布尔值的方法通常都有一个以问号结尾的名字. .结尾这个命名惯例通常时对两种方法区分:以感 ...

  6. C# Http方式下载文件到本地

    下文代码是从网络(http://www.cnblogs.com/hayden/archive/2012/04/26/2472815.html)得来,亲测好用.我中修改了下格式和注释,版权属于原作者“舒 ...

  7. 最好的10个移动 Web 应用程序开发框架

    在近期几年里,移动互联网快速发展.市场潜力巨大. 继计算机.互联网之后,移动互联网正掀起第三次信息技术革命的浪潮,新技术.新应用不断涌现.今天这篇文章向大家推荐10大优秀的移动Web开发框架.帮助开发 ...

  8. SpringMVC:文件上传

    MultipartFile attach HttpServletRequest re commons-io-2.0.jar (一定要用2.0以上的版本,否则没有copyInputStreamToFil ...

  9. 【转载】FAT32文件系统详解

    硬盘是用来存储数据的,为了使用和管理方便,这些数据以文件的形式存储在硬盘上.任何操作系统都有自己的文件管理系统,不同的文件系统又有各自不同的逻辑组织方式.例如:常见的文件系统有FAT,NTFS,EXT ...

  10. HDU-4930 Fighting the Landlords 多校训练赛斗地主

    仅仅须要推断一个回合就能够了,枚举推断能够一次出全然部牌或者大过对面的牌的可能,注意的是4张同样的牌带两张牌的话是能够被炸弹炸的. #include <iostream> #include ...