jQuery ajax序列化函数

参数序列化$.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()
时间: 2024-07-28 20:48:48

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

jQuery Ajax 操作函数

jQuery Ajax 操作函数 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求. .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxError() 当 Ajax 请求完成且出现错误时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxSend() 在 Ajax 请求发送之前显示

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

jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法 在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们发现程序执行完后并没有获取到我们想要的值,这时很有可能是因为你用的是ajax的异步调用async:true(默认情况),如: function ManageCommentText(text) { var result = text; $.ajax({ data: "get", url: &qu

jQuery Ajax 操作函数 (七)

函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求. .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxError() 当 Ajax 请求完成且出现错误时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxSend() 在 Ajax 请求发送之前显示一条消息. jQuery.ajaxSetup() 设置将来的 Ajax 请求的默认值. .ajaxStart() 当首个 Ajax 请求完成开始时注

Jquery Ajax 操作函数跟JQuery 遍历函数跟JQuery数据操作函数

JQuery文档操作方法 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数                                   描述 jQuery.ajax()                 执行异步 HTTP (Ajax) 请求. .ajaxComplete()            当 Ajax 请求完成时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxError()             

jquery ajax error函数详解

代码:$(document).ready(function() {            jQuery("#clearCac").click(function() {                jQuery.ajax({                    url: "/Handle/Do.aspx",                    type: "post",                    data: { id: '0' }

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

引用地址:https://blog.csdn.net/u014756827/article/details/52950514 使用jquery的ajax方法向服务器发送请求的时候,常常需要使用到error函数进行错误信息的处理,本文详细的说明了ajax中error函数和函数中各个参数的用法. 一般error函数返回的参数有三个: function(jqXHR jqXHR, String textStatus, String errorThrown).常见调用代码如下: $.ajax({ url:

jQuery ajax error函数的参数(交互错误信息的获取)

一般error函数返回的参数有三个: function(jqXHR jqXHR, String textStatus, String errorThrown).常见调用代码如下: $.ajax({ url: '/Home/AjaxGetData', success: function (data) { alert(data); }, error: function (jqXHR, textStatus, errorThrown) { /*错误信息处理*/ } }); 这里对这三个参数做详细说明.

Jquery ajax回调函数不执行

ajax如下: $.post( "${pageContext.request.contextPath}/deptHead_assign.action", {"studentId":student.id,"subjectId":selectedRows[0].subjectId}, function(result){ alert(result.num); $.messager.alert("系统提示","落选学生<

JavaScript封装Ajax工具函数及jQuery中的ajax

封装ajax工具函数 /** * ITCAST WEB * Created by zhousg on 2016/5/24. */ /* * 1. 请求的类型 type get post * 2. 请求地址 url * 3. 是异步的还是同步的 async false true * 4. 请求内容的格式 contentType * 5. 传输的数据 data json对象 * * 6.响应成功处理函数 success function * 7.响应失败的处理函数 error function *