jQuery ajax serialize() 方法使用示例


Posted in Javascript onNovember 02, 2014

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
<script type="text/jscript"> 
// $(function () { 
// alert($("form").serialize()); 
// }) 

function btnClick() { 
alert($("form").serialize()); 
} 
</script> 
</head> 
<body> 
<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="button" name="g" value="提交" id="g" onclick="btnClick()" /> 
</div> 
</form> 

</body> 
</html><span style="font-size:18px;color:#ff0000;"> 
</span>

点击提交:

输出标准的查询字符串:a=1&b=2&c=3&d=4&e=5

如果将复选框也选上的话 输出的就是:a=1&b=2&c=3&d=4&e=5&f=8

Javascript 相关文章推荐
Convert Seconds To Hours
Jun 16 Javascript
javascript js cookie的存储,获取和删除
Dec 29 Javascript
一步一步教你写一个jQuery的插件教程(Plugin)
Sep 03 Javascript
jQuery中校验时间格式的正则表达式小结
Sep 22 Javascript
jQuery淡入淡出元素让其效果更为生动
Sep 01 Javascript
JS实现的仿东京商城菜单、仿Win右键菜单及仿淘宝TAB特效合集
Sep 28 Javascript
微信小程序教程系列之设置标题栏和导航栏(7)
Jun 29 Javascript
基于 Vue 的树形选择组件的示例代码
Aug 18 Javascript
vue移动端路由切换实例分析
May 14 Javascript
layui获取选中行数据的实例讲解
Aug 19 Javascript
js布局实现单选按钮控件
Jan 17 Javascript
JS代码检查工具ESLint介绍与使用方法
Feb 04 Javascript
js获取UserControl内容为拼html时提供方便
Nov 02 #Javascript
Javscript调用iframe框架页面中函数的方法
Nov 01 #Javascript
js实现文章文字大小字号功能完整实例
Nov 01 #Javascript
js中confirm实现执行操作前弹出确认框的方法
Nov 01 #Javascript
js实现按钮加背景图片常用方法
Nov 01 #Javascript
js实现网页随机切换背景图片的方法
Nov 01 #Javascript
JS获取浏览器语言动态加载JS文件示例代码
Oct 31 #Javascript
You might like
PHP OPCode缓存 APC详细介绍
2010/10/12 PHP
js函数使用技巧之 setTimeout(function(){},0)
2009/02/09 Javascript
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
2009/02/17 Javascript
学习面向对象之面向对象的术语
2010/11/30 Javascript
关于JAVASCRIPT urldecode URL解码的问题
2012/01/08 Javascript
IE6背景图片不缓存问题解决方案及图片使用策略多个方法小结
2012/05/14 Javascript
Javascript Web Slider 焦点图示例源码
2013/10/10 Javascript
javascript类型转换示例
2014/04/29 Javascript
php+ajax+jquery实现点击加载更多内容
2015/05/03 Javascript
IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题
2015/08/21 Javascript
js数组的五种迭代方法及两种归并方法(推荐)
2016/06/14 Javascript
JavaScript中的Reflect对象详解(ES6新特性)
2016/07/22 Javascript
D3.js实现直方图的方法详解
2016/09/25 Javascript
Sortable.js拖拽排序使用方法解析
2016/11/04 Javascript
AngularJs基于角色的前端访问控制的实现
2016/11/07 Javascript
基于JavaScript实现右键菜单和拖拽功能
2016/11/28 Javascript
用jQuery实现优酷首页轮播图
2017/01/09 Javascript
layui前段框架日期控件使用方法详解
2017/05/19 Javascript
JavaScript实现多个物体同时运动
2020/03/12 Javascript
解决vue单页面多个组件嵌套监听浏览器窗口变化问题
2020/07/30 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
2020/09/02 Javascript
如何实现vue的tree组件
2020/12/03 Vue.js
简要讲解Python编程中线程的创建与锁的使用
2016/02/28 Python
python实现pdf转换成word/txt纯文本文件
2018/06/07 Python
python实现飞机大战微信小游戏
2020/03/21 Python
python实现从文件中读取数据并绘制成 x y 轴图形的方法
2018/10/14 Python
python实现微信小程序用户登录、模板推送
2019/08/28 Python
利用html5 canvas动态画饼状图的示例代码
2018/04/02 HTML / CSS
德国网上药房:Apotal
2017/04/04 全球购物
软件测试题目
2013/02/27 面试题
军人违纪检讨书
2014/02/04 职场文书
院领导写的就业推荐信
2014/03/09 职场文书
三分钟自我介绍演讲稿
2014/08/21 职场文书
2015年酒店工作总结
2015/04/28 职场文书
党校培训学习心得体会
2016/01/06 职场文书
java版 联机五子棋游戏
2022/05/04 Java/Android