jquery serialize()、serializearray()已经$.param方法
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方法的更多相关文章
- JQuery中serialize()、serializeArray()和param()方法示例介绍
在项目中做form表单提交的时候,如果参数比较少,可以通过jquery一个个取得,但是当 form表参数很多的情况下,还是一一取得的话无疑是加大了工作量,那我们需要咱们获取到表单的所有参数呢,幸好,j ...
- jquery的serializeArray、param 与serializeArray 的区别与源码解析
jQuery.param( obj, traditional ) 为url查询或者ajax 将对象或者数组转为url参数或ajax参数,是挂在jQuery对象上的静态方法,有码有真相: var myI ...
- jquery分隔Url的param方法
最近需要分隔url的querystring,用到了特意记录一下.方法: //获取url中的paramsvar search = location.search.substring(1);//param ...
- jQuery的序列化元素 serialize()方法 serializeArray()方法 param()方法
当提交的表单元素较多时用serialize()方法,serialize()方法也是作用于一个jQuery的对象,它能够将DOM元素内容序列化为字符串,用于Ajax请求. serialize() 方法通 ...
- JQuery中serialize()、serializeArray()和param()用法举例
在javascript中,serialize()方法也是作用于一个JQuery对象,它能够将DOM元素内容序列化为字符串,serializeArray()方法不是返回字符串,而是将DOM元素序列化后, ...
- (转)jquery serialize表单序列化,当radio或checkbox 未选中时,没有序列化到对象中的原因分析和解决方案 - ghostsf
相信很多人都用过jq的表单序列化serialize()方法,因为这能很方便地帮你把表单里所有的非禁用输入控件序列化为 key/value 对象,不需要你再去一个个地拼接参数了. 这是一个很好用的函数, ...
- Jquery如何序列化form表单数据为JSON对象 C# ADO.NET中设置Like模糊查询的参数 从客户端出现小于等于公式符号引发检测到有潜在危险的Request.Form 值 jquery调用iframe里面的方法 Js根据Ip地址自动判断是哪个城市 【我们一起写框架】MVVM的WPF框架(三)—数据控件 设计模式之简单工厂模式(C#语言描述)
jquery提供的serialize方法能够实现. $("#searchForm").serialize();但是,观察输出的信息,发现serialize()方法做的是将表单中的数 ...
- jquery.serialize
jQuery - serialize() 方法 serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. serialize()函数用于序列化一组表单元素,将表单内容编码为用于提交 ...
- 用jquery解析JSON数据的方法以及字符串转换成json的3种方法
用jquery解析JSON数据的方法,作为jquery异步请求的传输对象,jquery请求后返回的结果是 json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject ...
随机推荐
- 读javascript高级程序设计09-BOM
一.window 1.在全局作用域中定义的变量和函数会被归在window对象. var a=1,b=2; function add(a,b){ return a+b; } console.log(wi ...
- uva 1151(最小生成树,枚举子集)
题意:平面上有n个点(1<=N<=1000),你的任务是让所有n个点连通,为此,你可以新建一些边,费用等于两个端点的欧几里得距离的平方.另外还有q(0<=q<=8)个套餐,可以 ...
- React Native 的高度与宽度设置
React Native中的尺寸都是无单位的,表示的是与设备像素密度无关的逻辑像素点. import React, { Component } from 'react'; import { AppRe ...
- apache认证、授权、访问控制
认证对象:某一个网站目录. 启用认证 1.即用AllowOverride指令指定哪些指令在针对单个目录的配置文件中有效:AllowOverride AuthConfig 2.设置密码登录访问某个站点或 ...
- 黑客长期摇号不中"黑"掉北京小客车摇号网
新闻链接:http://www.2cto.com/News/201310/248936.html 新闻时间:2013-10-11 新闻正文: 为发泄长期摇号不中的不满,同时也为自己研发的软件打广告,硕 ...
- Visual Studio 拓展插件——Image Optimizer
一句话概括效用:在Visual Studio的解决方案中,为图片或包含图片的文件夹添加右键菜单,可对图片进行压缩,无损压缩. 在VS扩展工具中安装 安装好后在VS资源管理器中选择图片右键,在右键菜单中 ...
- 从0到1---“保多多”APP的开发(一)
2015年8月份,我正式接手了公司保多多APP的开发(和另一个同事一起). 我之前并没有过从0开始创建一款APP,这次能有这样的机会,实在让我感到兴奋.因为我相信,作为这款APP的主要开发人员,在这一 ...
- checkbox选中与取消选择
先上代码 <form> 你爱好的运动是?<br/> <input type="checkbox" name="items" val ...
- HM NIS Edit 2.0.3 Win32 Error. Code:740.请求的操作需要提升
使用NSIS安装向导,生成脚本后,按F9后,居然提示:HM NIS Edit 2.0.3 Win32 Error. Code:740.请求的操作需要提升 一开始就出错了,还真不顺. 在网上搜索了一下, ...
- E1_1 用邻接矩阵存储有向图,并输出各顶点的出度和入度
参考书:图论算法理论.实现及应用(北京大学出版社) 输入数据:(test.txt) 程序: /* 邻接矩阵存储有向图 */ #include <cstring> #include < ...