利用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 ...
随机推荐
- 安装R和Rstudio后,Rstudio出现空白和fatal error问题
解决方法: 1.一定要以管理员方式启动Rstudio 2.只能安装一个R版本,之前安装的其他版本需要卸载干净 3.R和Rstudio需要安装在同一目录下
- Nginx部署多个站点
Nginx部署多个站点 一,介绍与需求 1.1,介绍 详细介绍请看nginx代理部署Vue与React项目,在这儿主要介绍多个站点的配置 1.2,需求 有时候想在一台服务器上为不同的域名/不同的二级域 ...
- leadcode的Hot100系列--104. 二叉树的最大深度
依然使用递归思想. 思路: 1.树的深度 = max (左子树深度,右子树深度)+ 1 . ------> 这里的加1是表示自己节点深度为1. 2.如果当前节点为null,则说明它的左右子树深度 ...
- Ajax探讨
Ajax是一种技术方案,并不是什么新技术,Ajax请求使用XmlHttpRequest对象发送, XmlHttpRequest是一个浏览器接口,使得Javascript可以进行HTTP(S)通信. 最 ...
- Tensorflow教程(2)Tensorflow的常用函数介绍
1.tf.constant tf.constant用来定义一个常量,所谓常量,广义上讲就是“不变化的量”.我们先看下官方api是如何对constant函数来定义的: tf.constant( valu ...
- python 的一些小项目
1.在线教育平台(视频播放) 2.仿微信网页版(语音.视频.文字聊天) 3.高德API + Python 解决租房问题 4.仿知乎 5.Django打造文件分享系统.文件管理.搜索引擎(仿云盘) 6. ...
- MYSQL千万级别数据量迁移Elasticsearch5.6.1实战
从关系型库中迁移数据算是比较常见的场景,这里借助两个工具来完成本次的数据迁移,考虑到数据量并不大(不足两千万),未采用snapshot快照的形式进行. Elasticsearch-jdbc,Githu ...
- 【最小生成树之Kruskal例题-建设电力系统】-C++
前置知识点Kruskal最短路算法,如果没掌握的请先去掌握! 描述 小明所在的城市由于下暴雪的原因,电力系统严重受损.许多电力线路被破坏,因此许多村庄与主电网失去了联系.政府想尽快重建电力系统,所以, ...
- Jquery UI sortable
所有的事件回调函数都有两个参数:event和ui,浏览器自有event对象,和经过封装的ui对象 ui.helper - 表示sortable元素的JQuery对象,通常是当前元素的克隆对象 ui.p ...
- kafka学习(二)-------- 什么是Kafka
通过Kafka的快速入门 https://www.cnblogs.com/tree1123/p/11150927.html 能了解到Kafka的基本部署,使用,但他和其他的消息中间件有什么不同呢? K ...