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 相关文章推荐
js 静态动态成员 and 信息的封装和隐藏
May 29 Javascript
js下拉框二级关联菜单效果代码具体实现
Aug 03 Javascript
关于JS数组追加数组采用push.apply的问题
Jun 09 Javascript
JS实现一个列表中包含上移下移删除等功能
Sep 24 Javascript
jquery.cookie.js用法实例详解
Dec 25 Javascript
浅谈Cookie的生命周期问题
Aug 02 Javascript
JavaScript性能优化之函数节流(throttle)与函数去抖(debounce)
Aug 11 Javascript
js绑定事件和解绑事件
Apr 27 Javascript
jquery实现简单实用的轮播器
May 23 jQuery
vue 使用vue-i18n做全局中英文切换的方法
Oct 29 Javascript
IE8中jQuery.load()加载页面不显示的原因
Nov 15 jQuery
简述vue-cli中chainWebpack的使用方法
Jul 30 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
基于数据库的在线人数,日访问量等统计
2006/10/09 PHP
Banner程序
2006/10/09 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
记录Yii2框架开发微信公众号遇到的问题及解决方法
2018/07/20 PHP
利用location.hash实现跨域iframe自适应
2010/05/04 Javascript
DOM基础教程之使用DOM
2015/01/19 Javascript
javascript实现通过表格绘制颜色填充矩形的方法
2015/04/21 Javascript
vue,angular,avalon这三种MVVM框架优缺点
2016/04/27 Javascript
轻松掌握JavaScript代理模式
2016/08/26 Javascript
深入理解JavaScript继承的多种方式和优缺点
2017/05/12 Javascript
Kotlin学习第一步 kotlin语法特性
2017/05/25 Javascript
jquery ztree实现右键收藏功能
2017/11/20 jQuery
基于Bootstrap下拉框插件bootstrap-select使用方法详解
2018/08/07 Javascript
微信小程序自定义toast的实现代码
2018/11/16 Javascript
layui监听工具栏的实例(操作列表按钮)
2019/09/10 Javascript
[04:59]2018DOTA2亚洲邀请赛 4.7 Mineski夺冠时刻
2018/04/09 DOTA
[01:08:24]DOTA2-DPC中国联赛 正赛 RNG vs Phoenix BO3 第一场 2月5日
2021/03/11 DOTA
Python ZipFile模块详解
2013/11/01 Python
详解Python3中字符串中的数字提取方法
2017/01/14 Python
python3实现基于用户的协同过滤
2018/05/31 Python
flask框架中勾子函数的使用详解
2018/08/01 Python
selenium+python实现1688网站验证码图片的截取功能
2018/08/14 Python
python编程使用协程并发的优缺点
2018/09/20 Python
Python3.5常见内置方法参数用法实例详解
2019/04/29 Python
python动态视频下载器的实现方法
2019/09/16 Python
Python龙贝格法求积分实例
2020/02/29 Python
解决paramiko执行命令超时的问题
2020/04/16 Python
Python计算矩阵的和积的实例详解
2020/09/10 Python
canvas三角函数模拟水波效果的示例代码
2018/07/03 HTML / CSS
Styleonme中文网:韩国高档人气品牌
2017/06/21 全球购物
试解释COMMIT操作和ROLLBACK操作的语义
2014/07/25 面试题
会计毕业生自我鉴定
2013/11/04 职场文书
2014县政府领导班子三严三实对照检查材料思想汇报
2014/09/26 职场文书
2014年个人技术工作总结
2014/12/08 职场文书
行为习惯主题班会
2015/08/14 职场文书
2016特色励志班级口号
2015/12/24 职场文书