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 面向对象编程基础 多态
Aug 21 Javascript
分享Javascript中最常用的55个经典小技巧
Nov 29 Javascript
Backbone.js中的集合详解
Jan 14 Javascript
jQuery实现简单的间隔向上滚动效果
Mar 09 Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
Aug 08 Javascript
javascript之IE版本检测超简单方法
Aug 20 Javascript
Layui table 组件的使用之初始化加载数据、数据刷新表格、传参数
Sep 11 Javascript
Angular 数据请求的实现方法
May 07 Javascript
原生JS实现$.param() 函数的方法
Aug 10 Javascript
Vue项目中使用better-scroll实现一个轮播图自动播放功能
Dec 03 Javascript
ES6对象操作实例详解
May 23 Javascript
关于JavaScript 中 if包含逗号表达式
Nov 27 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中mail函数发送邮件失败的解决方法
2014/12/24 PHP
php字符串按照单词进行反转的方法
2015/03/14 PHP
Laravel中Trait的用法实例详解
2016/03/16 PHP
php自动提交表单的方法(基于fsockopen与curl)
2016/05/09 PHP
jquery实现的带缩略图的焦点图片切换(自动播放/响应鼠标动作)
2013/01/23 Javascript
jQuery之日期选择器的深入解析
2013/06/19 Javascript
Angular 路由route实例代码
2016/07/12 Javascript
JavaScript 最佳实践:帮你提升代码质量
2016/12/03 Javascript
关于Ajax的原理以及代码封装详解
2017/09/08 Javascript
在Swiper内如何制作CSS3动画效果示例代码
2017/12/07 Javascript
vue项目部署到Apache服务器中遇到的问题解决
2018/08/24 Javascript
Node+OCR实现图像文字识别功能
2018/11/26 Javascript
Vue form表单动态添加组件实战案例
2019/09/02 Javascript
python使用fileinput模块实现逐行读取文件的方法
2015/04/29 Python
Python交互环境下实现输入代码
2018/06/22 Python
Python matplotlib画图与中文设置操作实例分析
2019/04/23 Python
python路径的写法及目录的获取方式
2019/12/26 Python
Python实现结构体代码实例
2020/02/10 Python
简单几步用纯CSS3实现3D翻转效果
2019/01/17 HTML / CSS
HTML5 canvas实现移动端上传头像拖拽裁剪效果
2016/03/14 HTML / CSS
html5 canvas实现给图片添加平铺水印
2019/08/20 HTML / CSS
如何用Java判断一个文件或目录是否存在
2012/11/19 面试题
2014年小班元旦活动方案
2014/02/16 职场文书
培训主管的职业生涯规划
2014/03/06 职场文书
工商管理本科生求职信
2014/07/13 职场文书
公安交警中队队长个人对照检查材料思想汇报
2014/10/05 职场文书
工伤死亡理赔协议书
2014/10/20 职场文书
大学教师个人总结
2015/02/10 职场文书
2015年党建工作目标责任书
2015/05/08 职场文书
工作总结之小学教师体育工作范文(3篇)
2019/10/07 职场文书
PHP中->和=>的意思
2021/03/31 PHP
python使用pymysql模块操作MySQL
2021/06/16 Python
《仙剑客栈2》第一弹正式宣传片公开 年内发售
2022/04/07 其他游戏
win10电脑双屏显示一个黑屏怎么办?win10电脑双屏显示一个黑屏解决方法
2022/07/15 数码科技
JS实现刷新网页后之前浏览位置保持不变示例详解
2022/08/14 Javascript