jQuery ajax - serialize() 方法

实例

输出序列化表单值的结果:

$("button").click(function(){
$("div").text($("form").serialize());
});

亲自试一试

定义和用法

serialize() 方法通过序列化表单值,创建 URL 编码文本字符串。

您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身。

序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。

语法

$(selector).serialize()

详细说明

.serialize() 方法创建以标准 URL 编码表示的文本字符串。它的操作对象是代表表单元素集合的 jQuery 对象。

表单元素有几种类型:

<form>
<div><input type="text" name="a" value="1" id="a" /></div>
<div><input type="text" name="b" value="2" id="b" /></div>
<div><input type="hidden" name="c" value="3" id="c" /></div>
<div>
<textarea name="d" rows="8" cols="40">4</textarea>
</div>
<div><select name="e">
<option value="5" selected="selected">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select></div>
<div>
<input type="checkbox" name="f" value="8" id="f" />
</div>
<div>
<input type="submit" name="g" value="Submit" id="g" />
</div>
</form>

.serialize() 方法可以操作已选取个别表单元素的 jQuery 对象,比如 <input>, <textarea> 以及 <select>。不过,选择 <form> 标签本身进行序列化一般更容易些:

$('form').submit(function() {
alert($(this).serialize());
return false;
});

输出标准的查询字符串:

a=1&b=2&c=3&d=4&e=5

注释:只会将”成功的控件“序列化为字符串。如果不使用按钮来提交表单,则不对提交按钮的值序列化。如果要表单元素的值包含到序列字符串中,元素必须使用 name 属性。

jquery的ajax-serialize()的更多相关文章

  1. 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据

    jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...

  2. 详解Ajax请求(三)——jQuery对Ajax的实现及serialize()函数对于表单域控件参数提交的使用技巧

    原生的Ajax对于异步请求的实现并不好用,特别是不同的浏览器对于Ajax的实现并不完全相同,这就意味着你使用原生的Ajax做异步请求要兼顾浏览器的兼容性问题,对于java程序员来讲这是比较头疼的事情, ...

  3. jQuery与Ajax的应用——《锋利的jQuery》(第2版)读书笔记3

    第6章 jQuery与Ajax的应用 jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$ ...

  4. 第六章 jQuery和ajax应用

    ajax是异步JavaScript和xml的简称. 一. ajax补白 优势 不足(不一定是不足) 不需要任何插件(但需要浏览器支持js) XMLHttpRequest对象在不同浏览器下有差异 优秀的 ...

  5. jQuery的ajax 方法提交多个对象数组问题 C# traditional $.param

    当用$.ajax()向后台提交参数时,如果参数中数组的话一般在后台会用List<T>接收;但老是不成功如下面代码 "}]; "}]; function addUser( ...

  6. 【ERROR】使用jquery的ajax出现error:readyState=4,status=500

    使用jquery的ajax出现error:readyState=4,status=500,ajax代码如下: $.ajax({ url : "../toBeFinMisManage/show ...

  7. 触碰jQuery:AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

  8. jQuery调用AJAX异步详解[转]

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  9. 详细解读Jquery各Ajax函数

    $.get(),$.post(),$.ajax(),$.getJSON() 一,$.get(url,[data],[callback]) 说明:url为请求地址,data为请求数据的列表,callba ...

  10. 第八章 jQuery与Ajax应用

    Ajax(Asynchronous JavaScript and XML),异步JavaScript和XML,它实现的无刷新更新页面,能够进行异步提交. jQuery对Ajax进行了封装,最底层的是$ ...

随机推荐

  1. 【KM】POJ2195/HDU1533-Going home

    //最近没什么时间quq据说长得帅的人都在切八中,然而长得丑的人只能水水裸题 [题目大意] 给出一张地图及人和房屋的位置,求出每个人回到不同房屋所具有的最小代价和. [思路] 最小权匹配,先O(n^2 ...

  2. 《深入理解Spark-核心思想与源码分析》(三)第三章SparkContext的初始化

    3.1 SparkContext概述 SparkConf负责配置参数,主要通过ConcurrentHaspMap来维护各种Spark的配置属性. class SparkConf(loadDefault ...

  3. hdu4565之矩阵快速幂

    So Easy! Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total S ...

  4. winform treeView 数据绑定

    转载:http://www.jetwu.cn/archives/737 winform treeView 数据绑定 private void Form1_Load(object sender, Eve ...

  5. PostgreSQL配置文件--资源使用(除WAL外)

    2 资源使用(除WAL外) RESOURCE USAGE (except for WAL) 2.1 内存 Memory 2.1.1 shared_buffers 数字型 默认: shared_buff ...

  6. 正点原子STM32探索者学习笔记1

    1.在STM32的数据手册中,引脚定义中的I/O structure中如果是FT的话,说明该引脚兼容5V: 2.IO口一般都有多个功能,可以通过寄存器的设置来选择其IO口的功能,F1还有重映射的概念, ...

  7. webpack配置:图片处理、css分离和路径问题

    一.CSS中的图片处理: 1.首先在网上随便找一张图片,在src下新建images文件夹,将图片放在文件夹内 2.在index.html中写入代码:<div id="pic" ...

  8. 基于Spark Mllib,SparkSQL的电影推荐系统

    本文测试的Spark版本是1.3.1 本文将在Spark集群上搭建一个简单的小型的电影推荐系统,以为之后的完整项目做铺垫和知识积累 整个系统的工作流程描述如下: 1.某电影网站拥有可观的电影资源和用户 ...

  9. MongoDB集群设置集合分片生效及查看集合分片情况

    #连接mongos /opt/mongodb/mongodb-linux-x86_64-2.4.8/bin/mongo  127.0.0.1:27017   #使用admin数据库 use admin ...

  10. vue2 生命周期

    转:https://segmentfault.com/a/1190000008570622 生命周期先上图 什么是生命周期 Vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载 ...