serializeArray()与 serialize()
serialize()序列表表格内容为字符串,用于 Ajax 请求。
serializeArray()序列化表格元素 (类似 '.serialize()' 方法) 返回 JSON 数据结构数据。
.serializeArray()
编码一个form元素集合为一个“name属性值/value属性值”的数组。json结构,如:
[
{
name: a
value: 1
},
{
name: b
value: 2
},
{
name: c
value: 3
},
{
name: d
value: 4
},
{
name: e
value: 5
}
] .serialize()
编码一个form元素集合为有充的字符串。字符串为标准的url编码。如:
a=1&b=2&c=3&d=4&e=5 <form>
<!-- 能够被json数组、url字符串据提取数据类型 -->
<input type="text" name="a" value="1" id="a" />
<input type="text" name="b" value="2" id="b" />
<input type="hidden" name="c" value="3" id="c" />
<textarea name="d" rows="8" cols="40">4</textarea>
<select name="e">
<option value="5" selected="selected">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
<input type="checkbox" name="f" value="8" id="f1" checked="checked" />
<input type="checkbox" name="f" value="9" id="f2" />
<input type="radio" name="g" value="10" id="g1"/>
<input type="radio" name="g" value="11" checked="checked" id="g2"/>
<input type="password" name="h" maxlength="8" value="h" />
<!-- 不能够被json、url字符串据提取数据类型 -->
<input type="submit" name="i" value="Submit" id="i" />
<input type="button" name="j" value="Click me" onclick="msg()" />
<input type="file" name="k" /><br />
<input type="reset" value="Reset" name="l" />
<input type="image" src="/i/eg_submit.jpg" alt="Submit" />
</form>
<p><tt id="results"></tt></p>
<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><script>
function showValues() {
var str = $("form").serialize();
$("#results").text(str);
}
$(":checkbox, :radio").click(showValues);
$("select").change(showValues);
showValues();
</script>
serializeArray()与 serialize()的更多相关文章
- 【jQuery】serializeArray()与serialize()的区别
serialize()序列化表单元素为字符串,用于 Ajax 请求. serializeArray()序列化表单元素为JSON数据. 具体实例如下: 1 <!DOCTYPE html PUBLI ...
- jquery图片延迟加载 及 serializeArray、serialize用法记录
1.使用jquery实现 图片延迟加载 由于用户访问页面需要加载很多的图片,延迟加载技术在电子商务网站领域越来越普及,淘宝商城,京东商城,凡客等访问量巨大的电子商务站点为了增加用户用户体验,访问速度以 ...
- serializeArray()与serialize()的区别
serialize()序列化表单元素为字符串,用于 Ajax 请求. serializeArray()序列化表单元素为JSON数据. <script type="text/javasc ...
- serializeArray()和.serialize()的区别、联系
serializeArray()和.serialize()的区别.联系 <form id='addForm' action='UserAdd.action' type='post'> ...
- js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么
js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么 一.总结 一句话总结:两者都是对表单进行序列化,serializeArray()返回的是json ...
- jQuery 的 serializeArray()、serialize() 方法
serializeArray()方法说明: 实例 输出以数组形式序列化表单值的结果: $("button").click(function(){ x=$("form&qu ...
- jquery serializeArray()、serialize()增加数据
转自:http://blog.csdn.net/csdnzhangtao5/article/details/52981541 serialize().serializeArray()方法都是jquer ...
- [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...
- JQuery常用方法总结
1.json的创建方式 <script> $(function () { //第一种 var my = new People("CallmeYhz", 26); ale ...
随机推荐
- King Arthur's Birthday Celebration
每天抛一个硬币,硬币正面朝上的几率是p,直到抛出k次正面为止结束,第一天抛硬币需花费1,第二天花费3,然后是5,7,9……以此类推,让我们求出抛硬币的天数的期望和花费的期望. 天数期望: A.投出了k ...
- 003 jquery层次选择器
1.介绍 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...
- [java] 数据处理
背景: 有一组30天内的温度与时间的数据,格式如下: 详细情况:共30天的8k+项数据,每天内有260+项,每个记录温度的时间精确到秒 任务就是想根据这样的数据找到规律,来完成给定具体的时间预测出此时 ...
- python3脚本获取本机公网ip
python脚本获取本机公网ip 1.获取公网IP地址方式,访问:http://txt.go.sohu.com/ip/soip 2.代码实现 import requests import re r ...
- 009.KVM配置调整
一 内存CPU调整 1.1 增大虚拟机内存 [root@kvm-host ~]# virsh shutdown vm01-centos6.8 [root@kvm-host ~]# virsh edit ...
- 【Ray Tracing The Next Week 超详解】 光线追踪2-3
Preface 终于到了激动人心的纹理章节了 然鹅,看了下,并不激动 因为我们之前就接触过 当初有一个 attenuation 吗? 对了,这就是我们的rgb分量过滤器,我们画出的红色.蓝色.绿色等 ...
- Linux驱动之串口(UART)
<uart驱动程序概述> 在嵌入式Linux系统中,串口被看成终端设备,终端设备(tty)的驱动程序分为3部分: tty_core tty_disicipline tty_driver ...
- 【FFT&NTT 总结】
$FFT$总结 (因为还不会啊,,都没做过什么题,所以一边学一边打咯.. 1.主要是用来加速卷积形式的求和吧? $F*G(n)=F[i] × G[n-i]$ 平时是$O(n^2)$的,FFT可以$O( ...
- 20172302『Java程序设计』课程 结对编程练习_四则运算第二周阶段总结
一.结对对象 姓名:周亚杰 学号:20172302 担任角色:驾驶员(周亚杰) 伙伴第二周博客地址 二.本周内容 (一)继续编写上周未完成代码 1.本周继续编写代码,使代码支持分数类计算 2.相关过程 ...
- ant design select 坑总结
1.保持Option的value和select绑定的value一致,这样在select框中显示的才是Option中的节点文本label 2.labelInValue属性可以使选中项的文本label包装 ...