利用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 ...
随机推荐
- vs 编译说明
静态编译/MT,/MTD 是指使用libc和msvc相关的静态库(lib). 动态编译,/MD,/MDd是指用相应的DLL版本编译. 其中字母含义 d:debug m:multi-th ...
- throw 与 throws的比较
说实话,今天在公司的实习,确确实实编号被严重打脸了,说真的,自己的基础功不扎实,希望慢慢弥补吧! 抛出异常有三种形式,一是throw,一个throws,还有一种系统自动抛异常,下面它们之间的异同. 一 ...
- CentOS 网络互通情况下把一个Linux服务器的文件发送到另一个服务器
scp -r 文件名/目录名 root@192.168.2.144:/home/hsw -r 发送目录使用,表示把该目录下的所有子目录以及文件发送过去
- django基础知识之管理静态文件css,js,images:
管理静态文件 项目中的CSS.图片.js都是静态文件 配置静态文件 在settings 文件中定义静态内容 STATIC_URL = '/static/' STATICFILES_DIRS = [ o ...
- Java设计模式学习笔记(二) 简单工厂模式
前言 本篇是设计模式学习笔记的其中一篇文章,如对其他模式有兴趣,可从该地址查找设计模式学习笔记汇总地址 正文开始... 1. 简介 简单工厂模式不属于GoF23中设计模式之一,但在软件开发中应用也较为 ...
- 基于SpringBoot-Dubbo的微服务快速开发框架
简介: 基于Dubbo的分布式/微服务基础框架,为前端提供脚手架开发服务,结合前一篇--Web AP快速开发基础框架,可快速上手基于Dubbo的分布式服务开发,项目代码: https://github ...
- 关于vue项目font字体图标库导入未显示的问题
运行项目时,弹出以下信息:
- 网络IP的操作
10.10.10.10/8求解问题:子网掩码 10.255.255.255该IP地址所在网络的网络ID 10.0.0.0该IP地址所在网络的广播地址 10.255.255.255该IP地址所在网络的I ...
- Excel催化剂开源第42波-与金融大数据TuShare对接实现零门槛零代码获取数据
在金融大数据功能中,使用了TuShare的数据接口,其所有接口都采用WebAPI的方式提供,本来还在纠结着应该搬那些数据接口给用户使用,后来发现,所有数据接口都有其通用性,结合Excel灵活友好的输入 ...
- openlayer 5 获取中心点
之前在控制台把map对象打印出来后,有一个很像中心点坐标map.focus_.我可以确定的告诉大家,这个不是中心点坐标,检查出来的结果是地图中心最右的点位. 在创建地图时,会将中心点左边写在view中 ...