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 DOM学习第六章 表单实例
Feb 19 Javascript
遍历jquery对象的代码分享
Nov 02 Javascript
JQuery.closest(),parent(),parents()寻找父结点
Feb 17 Javascript
原生JavaScript编写俄罗斯方块
Mar 30 Javascript
jQuery DataTables插件自定义Ajax分页实例解析
Apr 28 Javascript
星期几的不同脚本写法(推荐)
Jun 01 Javascript
Vuejs 组件——props数据传递的实例代码
Mar 07 Javascript
浅谈Vuex@2.3.0 中的 state 支持函数申明
Nov 22 Javascript
JS封装的模仿qq右下角消息弹窗功能示例
Aug 22 Javascript
在vue项目中正确使用iconfont的方法
Sep 28 Javascript
基于mpvue的简单弹窗组件mptoast使用详解
Aug 02 Javascript
webpack + vue 打包生成公共配置文件(域名) 方便动态修改
Aug 29 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表单转换textarea换行符的方法
2010/09/10 PHP
PHP根据传入参数合并多个JS和CSS文件的简单实现
2014/06/13 PHP
PHP判断上传文件类型的解决办法
2015/10/20 PHP
JAVASCRIPT HashTable
2007/01/22 Javascript
jQuery随便控制任意div隐藏的方法
2013/06/28 Javascript
原生javascript实现无间缝滚动示例
2014/01/28 Javascript
JavaScript字符串对象slice方法入门实例(用于字符串截取)
2014/10/16 Javascript
html的DOM中document对象anchors集合用法实例
2015/01/21 Javascript
js+CSS实现弹出居中背景半透明div层的方法
2015/02/26 Javascript
JavaScript DOM进阶方法
2015/04/13 Javascript
Jquery 分页插件之Jquery Pagination
2015/08/25 Javascript
js canvas实现擦除动画
2016/07/16 Javascript
基于node.js实现微信支付退款功能
2017/12/19 Javascript
学习JS中的DOM节点以及操作
2018/04/30 Javascript
Vue+Element-U实现分页显示效果
2020/11/15 Javascript
使用原生javascript开发计算器实例代码
2021/02/21 Javascript
Python从MP3文件获取id3的方法
2015/06/15 Python
python jieba分词并统计词频后输出结果到Excel和txt文档方法
2018/02/11 Python
解决pyinstaller打包发布后的exe文件打开控制台闪退的问题
2019/06/21 Python
Python PIL图片添加字体的例子
2019/08/22 Python
Python3使用xml.dom.minidom和xml.etree模块儿解析xml文件封装函数的方法
2019/09/23 Python
解决numpy矩阵相减出现的负值自动转正值的问题
2020/06/03 Python
使用Python FastAPI构建Web服务的实现
2020/06/08 Python
python 如何快速复制序列
2020/09/07 Python
美国最便宜的旅游网站:CheapTickets
2017/07/09 全球购物
Zooplus葡萄牙:欧洲领先的网上宠物商店
2018/07/01 全球购物
一加手机美国官方网站:OnePlus美国
2019/09/19 全球购物
播音主持女孩的自我评价分享
2013/11/20 职场文书
工厂门卫岗位职责
2013/11/25 职场文书
微观物理专业自荐信
2014/01/26 职场文书
团干部培训方案
2014/06/03 职场文书
2014幼儿园教师师德师风演讲稿
2014/09/10 职场文书
525心理健康活动总结
2015/05/08 职场文书
Nginx搭建rtmp直播服务器实现代码
2021/03/31 Servers
MySQL事务操作的四大特性以及并发事务问题
2022/04/12 MySQL
vue修饰符.capture和.self的区别
2022/04/22 Vue.js