利用jQuery中的serialize方法大量获取页面中表单的数据，发送的服务器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form id="ifm" name="ifm">
<table>
<tr>
<td>姓名：</td>
<td><input type="text" name="name" value="李四"/></td>
</tr>
<tr>
<td>年龄：</td>
<td><input type="text" name="age" value="22"/></td>
</tr>
<tr>
<td>密码：</td>
<td><input type="password" name="pwd" value="123456"/></td>
</tr>
<tr>
<td>性别：</td>
<td>
<input type="radio" name="sex" value="male" id="male" checked="" />
<label for="male">男</label>
<input type="radio" name="sex" value="female" id="female"/>
<label for="female">女</label>
</td>
</tr>
<tr>
<td>地区：</td>
<td>
<select name="area" id="area">
<option value="锦江区" selected>锦江区</option>
<option value="金牛区">金牛区</option>
<option value="青羊区">青羊区</option>
</select>
</td>
</tr>
<tr>
<td>爱好</td>
<td>
<input type="checkbox" id="move" value="move" name="habb" checked/>
<label for="move">电影</label>
<input type="checkbox" id="music" value="music" name="habb" checked/>
<label for="music">音乐</label>
<input type="checkbox" id="basketball" value="basketball" name="habb[]"/>
<label for="basketball">篮球</label>
</td>
</tr>
<tr>
<td>个人介绍：</td>
<td><textarea name="txt" id="txt" cols="30" rows="2">WEB前段攻城师</textarea></td>
</tr>
<tr>
<td></td>
<td><input type="button" value="提交" id="btn"/></td>
</tr>
<tr>
<td><button>123</button></td>
<td></td>
</tr>
</table>
</form>
<script src="jquery-1.11.1.js"></script>
<script>
function getData(){
var frm = $('#ifm');
var data = frm.serialize();
var arr = data.split('&');
var item,key,value,newData = {};
for(var i = 0; i < arr.length; i++){
item = arr[i].split('=');
key = decodeURI(item[0]);
value = decodeURI(item[1]);
if(key.indexOf('[]')!= -1){
key.replace('[]','');
if (!newData[key]){
newData[key]=[];
}
newData[key].push(value);
}else{
newData[key]=value;
}
}
return newData;
}
$('#btn').bind('click',function(){
var newdata=getData();
$.post('test.php',newdata,function(){
console.log('success');
});
});
</script>
</body>
</html>
test.php响应的数据是这样的
利用jQuery中的serialize方法大量获取页面中表单的数据，发送的服务器的更多相关文章
- jquery中的load方法加载页面无法缓存问题
在A页面中调用JQuery中的load方法,加载另一个B页面,B页面中的样式文件和JS文件无法从浏览器缓存中获取,每次都是实时获取.这是因为B页面的HTML经load方法处理后,会为每个样式和JS文件 ...
- jQuery中使用data()方法读取HTML5自定义属性data-*实例
如果你使用jQuery类库,那么你可以非常愉悦的使用jquery的data()方法存取data-* 自定义属性,方法允许我们在DOM元素上绑定任意类型的数据,避免了循环引用的内存泄漏风险 主要的方法如 ...
- 使用 jQuery 选择器获取页面元素后，利用 jQuery 对象的 css() 方法设置其样式。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式. 要求如下: 点击页面的"更改样式"按钮后, ...
- 使用 jQuery 选择器获取页面元素，然后利用 jQuery 对象的 css() 方法设置其 display 样式属性，从而实现显示和隐藏效果。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...
- 使用 jQuery 基本选择器获取页面元素，然后利用 jQuery 对象的 css() 方法动态设置 ＜span＞ 和 ＜a＞ 标签的样式
查看本章节 查看作业目录 需求说明: 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式 ...
- 用JQuery中的Ajax方法获取web service等后台程序中的方法
用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...
- jquery 中一些 特殊方法 的特殊使用 一览表
cnblogs的页面, 一种是管理页面, 是随笔的列表 a full list of essays. 另一种是 首页. 要搜索文档的话, 就使用 "首页"的那种方式. 一个jque ...
- $.ajax()方法详解 jquery中的ajax方法
jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...
- jquery中的ajax方法参数
引用来自:http://www.cnblogs.com/tylerdonet/p/3520862.html jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String ...
随机推荐
- CentOS7搭建LNMP环境
以前写的过时了,重新发一篇新的. 安装PHP 下载官网:https://www.php.net/downloads.php 为了方便,我存了现成的 百度网盘:https://pan.baidu.com ...
- CDH 5.15.2 离线安装
一.前置准备 1. 基础信息 1.1 机器 机器名 服务 hadoop1 主节点 hadoop2 data.task hadoop3 data.task 1.2 服务版本 服务 版本 cdh 5.15 ...
- kafka源码分析（一）server启动分析
1 启动入口Kafka.scala Kafka的启动入口是Kafka.scala的main()函数: def main(args: Array[String]): Unit = { try { //通 ...
- 在Ubuntu16.04 TLS 安装LAMP
准备在虚拟机上搭建一个靶机系统(DoraBox),但是还不想使用一键搭建所以起了心思准备使用LAMP框架搭载这个靶机系统,于是有了以下文章,先从百度搜索一下,Ubuntu搭建LAMP. 然后点进去第一 ...
- （ps2018）Adobe Photoshop CC 2018 中文版破解版
ps2018新功能 1.更紧密连接的 Photoshop.全新的智慧型锐利化. 2.智慧型增加取样.内含 Extended 功能.Camera RAW 8 和图层支援 3.可编辑的圆角矩形.多重形状和 ...
- Java 代码界 3% 的王者？看我是如何解错这 5 道题的
前些日子,阿里妹(妹子出题也这么难)发表了一篇文章<悬赏征集!5 道题征集代码界前 3% 的超级王者>——看到这个标题,我内心非常非常激动,因为终于可以证明自己技术很牛逼了. 但遗憾的是, ...
- 番外：深浅copy
进击のpython 深浅copy copy是什么意思? 复制 (又学一个单词!开不开森) 那啥叫复制呢? 百度百科上给的解释是:仿原样品制造 我们曾经有过这样的印象 a = "zhangsa ...
- 个人永久性免费-Excel催化剂功能第75波-标签式报表转标准数据源
数据处理永远是数据分析工作中重中之重的任务,大部分人深深地陷入在数据处理的泥潭中,今天Excel催化剂再接再厉,在过往已提供了主从结构报表数据源的数据转换后,再次给大家送上标签式报表数据源的数据转换操 ...
- Git储藏和引用日志
在日常工作中,当要经常停下手头的工作区修复临时的BUG,紧急处理来自同事或者经理的请求,但是又不能将手头的工作进行提交的时候.那么Git储藏功能(stash)就起到作用了. 储藏可以捕获我们的工作区状 ...
- SpringBoot热部署报错（BeanCreationException: Error creating bean with name 'classPathFileSystemWatcher' d）
springboot热部署配置方法 http://blog.csdn.net/pyfysf/article/details/78791292 异常信息如下 org.springframework.be ...