利用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 ...
随机推荐
- IO解惑：cephfs、libaio与io瓶颈
最近笔者在对kernel cephfs客户端进行fio direct随机大io读测试时发现,在numjobs不变的情况下,使用libaio作为ioengine,无论怎么调节iodepth,测试结果都变 ...
- ElasticSearch 7.1.1 集群环境搭建
1. 集群简介 三台机器,均用于保存数据且可被选为master节点 服务版本 服务 版本 elasticsearch 7.1.1 jdk 1.8 1. 创建elsearch用户 不建议直接使用root ...
- POJ 2914：Minimum Cut（全局最小割Stoer-Wagner算法）
http://poj.org/problem?id=2914 题意:给出n个点m条边,可能有重边,问全局的最小割是多少. 思路:一开始以为用最大流算法跑一下,然后就超时了.后来学习了一下这个算法,是个 ...
- cookie 和 session 设置
cookie: 保存在浏览器上的一组键值对, 是由服务器让浏览器进行设置的 下次浏览器访问的时候会携带cookie. request是客户端请求, response是服务端响应. 读取客户端的cook ...
- leetcode 141 Linked List Cycle Hash fast and slow pointer
Problem describe:https://leetcode.com/problems/linked-list-cycle/ Given a linked list, determine if ...
- vue组件间通信六种方式（完整版）
本文总结了vue组件间通信的几种方式,如props. $emit/ $on.vuex. $parent / $children. $attrs/ $listeners和provide/inject,以 ...
- 原创：Python编写通讯录，支持模糊查询，利用数据库存储
1.要求 数据库存储通讯录,要求按姓名/电话号码查询,查询条件只有一个输入入口,自动识别输入的是姓名还是号码,允许模糊查询. 2.实现功能 可通过输入指令进行操作. (1)首先输入“add”,可以对通 ...
- 关于Markdown编辑器的基本使用规则
@TOC 欢迎使用Markdown编辑器 你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页.如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown ...
- Spring Cloud Alibaba | Sentinel: 服务限流高级篇
目录 Spring Cloud Alibaba | Sentinel: 服务限流高级篇 1. 熔断降级 1.1 降级策略 2. 热点参数限流 2.1 项目依赖 2.2 热点参数规则 3. 系统自适应限 ...
- 1.svn 彻底clear时，注意代码备份 2.借助vc助手加头文件
1.svn 彻底clear时,注意代码备份 2.不小心彻底clear可以在回收站找到 3.借助vc助手加头文件