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 相关文章推荐
javascript JSON操作入门实例
Apr 16 Javascript
javascript 数组排序函数sort和reverse使用介绍
Nov 21 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
Dec 15 Javascript
jquery实现选中单选按钮下拉伸缩效果
Aug 06 Javascript
javascript日期操作详解(脚本之家整理)
Sep 05 Javascript
jquery动态增加删减表格行特效
Nov 20 Javascript
jQuery中$.each()函数的用法引申实例
May 12 Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 Javascript
详解js中Json的语法与格式
Nov 22 Javascript
详解React开发必不可少的eslint配置
Feb 05 Javascript
JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】
Feb 06 Javascript
解决ele ui 表格表头太长问题的实现
Nov 13 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
PHP中几个常用的魔术常量
2012/02/23 PHP
日常整理PHP中简单的图形处理(经典)
2015/10/26 PHP
PHP使用Memcache时模拟命名空间及缓存失效问题的解决
2016/02/27 PHP
LAMP环境使用Composer安装Laravel的方法
2017/03/25 PHP
什么是PHP文件?如何打开PHP文件?
2017/06/27 PHP
laravel框架中路由设置,路由参数和路由命名实例分析
2019/11/23 PHP
用YUI做了个标签浏览效果
2007/02/20 Javascript
Jquery下的26个实用小技巧(jQuery tips, tricks &amp; solutions)
2010/03/01 Javascript
jquery下onpropertychange事件的绑定方法
2010/08/01 Javascript
JavaScript初学者需要了解10个小技巧
2010/08/25 Javascript
仅Firefox中链接A无法实现模拟点击以触发其默认行为
2011/07/31 Javascript
JS将表单导出成EXCEL的实例代码
2013/11/11 Javascript
javascript的回调函数应用示例
2014/02/20 Javascript
Jquery修改页面标题title其它JS失效的解决方法
2014/10/31 Javascript
解决js图片加载时出现404的问题
2020/11/30 Javascript
JS模态窗口返回值兼容问题的完美解决方法
2016/05/28 Javascript
D3.js实现饼状图的方法详解
2016/09/21 Javascript
Javascript 事件冒泡机制详细介绍
2016/10/10 Javascript
node.js操作MongoDB的实例详解
2017/10/11 Javascript
JavaScript中严格判断NaN的方法
2018/02/16 Javascript
JS正则表达式封装与使用操作示例
2019/05/15 Javascript
Javascript摸拟自由落体与上抛运动原理与实现方法详解
2020/04/08 Javascript
JavaScript实现HTML导航栏下拉菜单
2020/11/25 Javascript
[04:39]显微镜下的DOTA2第十三期—Pis卡尔个人秀
2014/04/04 DOTA
Python实现身份证号码解析
2015/09/01 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
python实现远程通过网络邮件控制计算机重启或关机
2018/02/22 Python
CSS3制作ajax loader icon实现思路及代码
2013/08/25 HTML / CSS
详解Canvas 实现炫丽的粒子运动效果(粒子生成文字)
2018/02/01 HTML / CSS
印尼购物网站:iLOTTE
2019/10/16 全球购物
2014国培学习感言
2014/03/05 职场文书
关于教师节的演讲稿
2014/09/04 职场文书
校园广播稿精选
2014/10/01 职场文书
2016年春季运动会加油稿
2015/07/22 职场文书
职业生涯规划书之大学四年
2019/08/07 职场文书