参数序列化$.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. Spring MVC中@ControllerAdvice注解实现全局异常拦截

    在网上很多都把Advice翻译成增强器,其实从翻译工具上看到,这个单词翻译是忠告,通知的意思. 首先这个注解实在Spring Web包下,而Spring MVC离不开Spring Web的依赖,所以经 ...

  2. Java加密技术（八）——数字证书

    原文:http://snowolf.iteye.com/blog/391931 请大家在阅读本篇内容时先阅读 Java加密技术(四),预先了解RSA加密算法. 在构建Java代码实现前,我们需要完成证 ...

  3. 如何使用ssh远程编辑定时任务crontab？

    linxu定时任务使用crontab,编辑crontab可以直接编辑:crontab -e:也可以直接读取文件 crontab file.这两种操作都不需要特殊权限sudo.区别在于,crontab ...

  4. minimum-moves-to-equal-array-elements-ii（好）

    https://leetcode.com/problems/minimum-moves-to-equal-array-elements-ii/ package com.company; import ...

  5. Redis安装过程

    Redis在windows下安装过程 学习了:https://www.cnblogs.com/M-LittleBird/p/5902850.html 学习了:http://www.runoob.com ...

  6. sql的一些知识_函数_汇总数据

    汇总数据 avg()---------求平均数 值得注意的是:avg()只能用于一个列的平均值查询,多个列的平均值请使用多个avg() avg()忽略null值 count()-------计数(指定 ...

  7. 【Caffe代码解析】compute_image_mean

    功能: 计算训练数据库的平均图像. 由于平均归一化训练图像会对结果有提升,所以Caffe里面,提供了一个可选项. 用法: compute_image_mean [FLAGS] INPUT_DB [OU ...

  8. HDU 2648（搜索题，哈希表）

    #include<iostream> #include<map> #include<string> #include<cstring> #include ...

  9. Unable to satisfy the following requirements解决方式

    今天从git上面download我们项目,然后向往常一样安装Cocoapods.可是却突然发现报错了,尝试了几遍.发现一直报错. 然后我这才看了一下,安装Cocoapods的日志,发现抛出了一个报错. ...

  10. Tachyon源代码结构分析（二）

    公布人:南京大学PASA大数据实验室顾荣 前言 在上一篇<Tachyon源代码结构分析(一)>中,我们介绍了Tachyon的四大模块(Client模块.Master模块.Worker模块以 ...