serialize:

序列表表格内容为字符串,用于 Ajax 请求。可以对整个form,也可以只针对某部分。

HTML 代码:
<p id="results"><b>Results: </b> </p>
<form>
<select name="single">
<option>Single</option>
<option>Single2</option>
</select>
<select name="multiple" multiple="multiple">
<option selected="selected">Multiple</option>
<option>Multiple2</option>
<option selected="selected">Multiple3</option>
</select><br/>
<input type="checkbox" name="check" value="check1"/> check1
<input type="checkbox" name="check" value="check2" checked="checked"/> check2
<input type="radio" name="radio" value="radio1" checked="checked"/> radio1
<input type="radio" name="radio" value="radio2"/> radio2
</form>
jQuery 代码:
$("#results").append( "<tt>" + $("form").serialize() + "</tt>" );

$('#form').submit(function(event){
event.preventDefault();

$.ajax({
url:' ',
type:'post',
data:$("form").serialize(),

}

参考:http://api.jquery.com/serialize/

serializeArray():

Encode a set of form elements as an array of names and values.

定义和用法

serializeArray() 方法通过序列化表单值来创建对象数组(名称和值)。

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

语法

$(selector).serializeArray()

serializeArray() 方法序列化表单元素(类似 .serialize() 方法),返回 JSON 数据结构数据。

注意:此方法返回的是 JSON 对象而非 JSON 字符串。需要使用插件或者第三方库进行字符串化操作。

返回的 JSON 对象是由一个对象数组组成的,其中每个对象包含一个或两个名值对 —— name 参数和 value 参数(如果 value 不为空的话)。举例来说:

[
{name: 'firstname', value: 'Hello'},
{name: 'lastname', value: 'World'},
{name: 'alias'}, // 值为空
]

.serializeArray() 方法使用了 W3C 关于 successful controls(有效控件) 的标准来检测哪些元素应当包括在内。特别说明,元素不能被禁用(禁用的元素不会被包括在内),并且元素应当有含有 name 属性。提交按钮的值也不会被序列化。文件选择元素的数据也不会被序列化。

该方法可以对已选择单独表单元素的对象进行操作,比如 <input>, <textarea>, 和 <select>。不过,更方便的方法是,直接选择 <form> 标签自身来进行序列化操作。

$("form").submit(function() {
console.log($(this).serializeArray());
return false;
});

上面的代码产生下面的数据结构(假设浏览器支持 console.log):

[
{
name: a
value: 1
},
{
name: b
value: 2
},
{
name: c
value: 3
},
{
name: d
value: 4
},
{
name: e
value: 5
}
]

取得表单内容并插入到网页中:

<p><b>Results:</b> <span id="results"></span></p>
<form>
<select name="single">
<option>Single</option>
<option>Single2</option>
</select>
<select name="multiple" multiple="multiple">
<option selected="selected">Multiple</option>
<option>Multiple2</option>
<option selected="selected">Multiple3</option>
</select>
<br>
<input type="checkbox" name="check" value="check1" id="ch1">
<label for="ch1">check1</label>
<input type="checkbox" name="check" value="check2" checked="checked" id="ch2">
<label for="ch2">check2</label>
<input type="radio" name="radio" value="radio1" checked="checked" id="r1">
<label for="r1">radio1</label>
<input type="radio" name="radio" value="radio2" id="r2">
<label for="r2">radio2</label>
</form> <script>
function showValues() {
var fields = $( ":input" ).serializeArray();
$( "#results" ).empty();
jQuery.each( fields, function( i, field ) {
$( "#results" ).append( field.value + " " );
});
} $( ":checkbox, :radio" ).click( showValues );
$( "select" ).change( showValues );
showValues();
</script> </body>
</html>

$(":input")                  选择所有的表单输入元素,包括input, textarea, select 和 button.

参考:
http://www.w3school.com.cn/jquery/ajax_serializearray.asp
http://api.jquery.com/serializeArray/

$.params()

序列化一个 key/value 对象:

var params = { width:1900, height:1200 };
var str = jQuery.param(params);
$("#results").text(str);

结果:

width=1680&height=1050
参考:http://www.w3school.com.cn/jquery/ajax_param.asp

jquery serialize()、serializearray()已经$.param方法的更多相关文章

  1. JQuery中serialize()、serializeArray()和param()方法示例介绍

    在项目中做form表单提交的时候,如果参数比较少,可以通过jquery一个个取得,但是当 form表参数很多的情况下,还是一一取得的话无疑是加大了工作量,那我们需要咱们获取到表单的所有参数呢,幸好,j ...

  2. jquery的serializeArray、param 与serializeArray 的区别与源码解析

    jQuery.param( obj, traditional ) 为url查询或者ajax 将对象或者数组转为url参数或ajax参数,是挂在jQuery对象上的静态方法,有码有真相: var myI ...

  3. jquery分隔Url的param方法

    最近需要分隔url的querystring,用到了特意记录一下.方法: //获取url中的paramsvar search = location.search.substring(1);//param ...

  4. jQuery的序列化元素 serialize()方法 serializeArray()方法 param()方法

    当提交的表单元素较多时用serialize()方法,serialize()方法也是作用于一个jQuery的对象,它能够将DOM元素内容序列化为字符串,用于Ajax请求. serialize() 方法通 ...

  5. JQuery中serialize()、serializeArray()和param()用法举例

    在javascript中,serialize()方法也是作用于一个JQuery对象,它能够将DOM元素内容序列化为字符串,serializeArray()方法不是返回字符串,而是将DOM元素序列化后, ...

  6. (转)jquery serialize表单序列化,当radio或checkbox 未选中时,没有序列化到对象中的原因分析和解决方案 - ghostsf

    相信很多人都用过jq的表单序列化serialize()方法,因为这能很方便地帮你把表单里所有的非禁用输入控件序列化为 key/value 对象,不需要你再去一个个地拼接参数了. 这是一个很好用的函数, ...

  7. Jquery如何序列化form表单数据为JSON对象 C# ADO.NET中设置Like模糊查询的参数 从客户端出现小于等于公式符号引发检测到有潜在危险的Request.Form 值 jquery调用iframe里面的方法 Js根据Ip地址自动判断是哪个城市 【我们一起写框架】MVVM的WPF框架(三)—数据控件 设计模式之简单工厂模式(C#语言描述)

    jquery提供的serialize方法能够实现. $("#searchForm").serialize();但是,观察输出的信息,发现serialize()方法做的是将表单中的数 ...

  8. jquery.serialize

    jQuery - serialize() 方法 serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. serialize()函数用于序列化一组表单元素,将表单内容编码为用于提交 ...

  9. 用jquery解析JSON数据的方法以及字符串转换成json的3种方法

    用jquery解析JSON数据的方法,作为jquery异步请求的传输对象,jquery请求后返回的结果是 json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject ...

随机推荐

  1. /etc/rc.d/与/etc/rc.d/init.d的关系

    /etc/init.d指向/etc/rc.d/init.d目录 . 除了直接调用脚本外(如/etc/rc.d/init.d/xinetd),还可以用service命令来控制init.d目录下的服务如 ...

  2. C语言输出时的各种%

    d  以十进制形式输出带符号整数(正数不输出符号) o  以八进制形式输出无符号整数(不输出前缀O) x  以十六进制形式输出无符号整数(不输出前缀OX) u  以十进制形式输出无符号整数 f  以小 ...

  3. android代码嵌入html代码

    有时候需要在一个TextView控件中设置两种不同颜色的字体,这时候可以使用Html.fromHtml方法实现 例如: tvTaskDesc.setText(Html.fromHtml("当 ...

  4. iOS开发UI篇—IOS开发中Xcode的一些使用技巧

    iOS开发UI篇—IOS开发中Xcode的一些使用技巧 一.快捷键的使用 经常用到的快捷键如下: 新建 shift + cmd + n     新建项目 cmd + n             新建文 ...

  5. Regsvr32.exe 用法

    RegSvr32.exe 具有以下命令行选项:  Regsvr32 [/u] [/n] [/i[:cmdline]] dllname /u - 取消注册服务器 /i - 调用 DllInstall,为 ...

  6. MySql指令集

    http://blog.csdn.net/cl05300629/article/details/9464007

  7. 转帖不会乱码的,powershell网络蜘蛛

    抓取(爬取)网上信息的脚本程序,俗称网络蜘蛛.powershell中自带了这样的两个命令,[Invoke-WebRequest]和[Invoke-RestMethod],但这两个命令有时候会乱码. 现 ...

  8. enmo_day_10

    RMAN 创建备份集 : backup as backupset format ‘/backup/df_%d_%s_%p/bus’ tablespace hr_data; 创建镜像副本 :(备份慢,恢 ...

  9. fck编辑器漏洞想到的--目录的执行权限

    结合近来我遇到的问题,转一篇关于目录的执行权限问题.来解决fck编辑器的漏洞.漏洞就是给人家上传了文件,而且还遍历目录或者直接执行文件,,非常大大的危险. 解决方法如下. 1,首先要删除fckedit ...

  10. 关于async

    以前做项目很少理会async这个属性 今天做项目的时候 由于原来是点击查看按钮进行查看 现在要把需求改成默认进入页面就直接显示内容 我在js加载的时候就需要调用一次查看的点击事件 我在整个js初始加载 ...