原始form表单值获取方式(手动):
$.ajax({
type: "POST",
url: "ajax.php",
data: "Name=摘取天上星&position=IT技术",
success: function(msg){alert(msg);},
error: function(error){alert(error);}
});

JQ serialize()方法取值:

$.ajax({
type: "POST",
url:"ajax.php",
data:$('#formID').serialize(),// 要提交的表单
success: function(msg) {alert(msg);},
error: function(error){alert(error);}
});

serialize()序列化表单实例:

<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#button").click(function(){
alert($("#formID").serialize());
});
});
</script>
<form id="formID">
姓名 <input value="摘取天上星" name="Name" />
职位 <input value="IT技术" name="position" />
<input id="button" value="提交" type="button" />
</form>

将form中的值转换为键值对:

// 如:{Name:'摘取天上星',position:'IT技术'}
// ps:注意将同名的放在一个数组里
function getFormJson(form) {
var o = {};
var a = $(form).serializeArray();
$.each(a, function () {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
}

键值对方式的AJAX调用:

//调试调用
$(function(){
$("#button").click(function(){
alert(getFormJson("#formID"));
});
});
//Ajax提交
$.ajax({
type: "POST",
url:"ajax.php",
data:getFormJson($("#formID")),//表单数据JSON格式的函数參数里填写表单的ID或要提交的表单
dataType: 'json',
success: function(msg) {alert(msg);},
error: function(error){alert(error);}
});

实例中通用的HTML表单:

<form id="formID">
姓名 <input value="摘取天上星" name="Name" />
职位 <input value="IT技术" name="position" />
<input id="button" value="提交" type="button" />
</form>

jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法的更多相关文章

  1. 表单提交Post方法、Get方法

     表单用来接受用户的输入,并将用户的输入以“name=value值对”集合的形式提交到服务器进行处理.那么表单是怎样将数据提交到服务器的?服务器是怎样对表单数据进行处理的?下面我将为大家揭开表单提交背 ...

  2. MySQL Innodb的两种表空间方式

    要说表空间,MySQL的表空间管理远远说不上完善.换句话说,事实上MySQL根本没有真正意义上的表空间管理.MySQL的Innodb包含两种表空间文件模式,默认的共享表空间和每个表分离的独立表空间.只 ...

  3. INNODB与MyISAM两种表存储引擎区别

    mysql数据库分类为INNODB为MyISAM两种表存储引擎了,两种各有优化在不同类型网站可能选择不同,下面小编为各位介绍mysql更改表引擎INNODB为MyISAM技巧. 常见的mysql表引擎 ...

  4. Python与数据库[2] -> 关系对象映射/ORM[2] -> 建立声明层表对象的两种方式

    建立声明层表对象的两种方式 在对表对象进行建立的时候,通常有两种方式可以完成,以下是两种方式的建立过程对比 首先导入需要的模块,获取一个声明层 from sqlalchemy.sql.schema i ...

  5. select into from和insert into select from两种表复制语句区别

    select into from和insert into select from两种表复制语句都是将源表source_table的记录插入到目标表target_table,但两句又有区别. 第一句(s ...

  6. 读取xml文件转成List<T>对象的两种方法(附源码)

    读取xml文件转成List<T>对象的两种方法(附源码) 读取xml文件,是项目中经常要用到的,所以就总结一下,最近项目中用到的读取xml文件并且转成List<T>对象的方法, ...

  7. 取xml文件转成List<T>对象的两种方法

    读取xml文件转成List<T>对象的两种方法(附源码)   读取xml文件转成List<T>对象的两种方法(附源码) 读取xml文件,是项目中经常要用到的,所以就总结一下,最 ...

  8. Hive的两种表

    1.内部表 内部表Load数据有两种方式:① Load data ***:②hdfs dfs -put ****.这是因为在Metastore文件,即mysql的hive数据库的“SDS”表中,保存着 ...

  9. 调用init方法 两种方式 一个是浏览器方法 一个是 xml中手工配置(load-on-startup)

    调用init方法 两种方式 一个是浏览器方法 一个是 xml中手工配置(load-on-startup)

随机推荐

  1. AngularJS学习篇(十七)

    AngularJS 输入验证 <!DOCTYPE html> <html> <script src="http://apps.bdimg.com/libs/an ...

  2. Browsing contexts 浏览器上下文

    浏览上下文就是document object 呈现给用户的所在的环境   每一个标签或者窗口都包含一个浏览器上下文,包括iframe   frames      每一个browsing context ...

  3. HTML学习笔记 cs2D3D展示基础 第十四节 (原创) 参考使用表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 2000W条数据,加入全文检索的总结

    一) 前期准备测试: 旧版的MySQL的全文索引只能用在MyISAM表格的char.varchar和text的字段上. 不过新版的MySQL5.6.24上InnoDB引擎也加入了全文索引,所以具体信息 ...

  5. CSS实现父元素半透明,子元素不透明

    CSS实现父元素半透明,子元素不透明. 很久以来大家都习惯使用opacity:0.5在新式浏览器里实现半透明,而对IE较旧的版本使用filter:Alpha(opacity=0.5)的滤镜来实现半透明 ...

  6. 基础拾遗-----mongoDB操作

    基础拾遗 基础拾遗------特性详解 基础拾遗------webservice详解 基础拾遗------redis详解 基础拾遗------反射详解 基础拾遗------委托详解 基础拾遗----- ...

  7. canvas 粒子效果

    var canvas = document.createElement('canvas'); var cxt = canvas.getContext('2d'); var W = canvas.wid ...

  8. vue+node+webpack搭建环境

    一.环境搭建 1.1.去官网安装node.js( http://www.runoob.com/nodejs/nodejs-install-setup.html  ) 注意node的版本,只有支持和谐模 ...

  9. ASP.NET中HttpContext.Cache的使用

    -------------------------------键 --值-----依赖-----过期时间-------------------------------绝对过期------------- ...

  10. openFace 人脸识别框架测试

    openface  人脸识别框架  但个人感觉精度还是很一般 openface的githup文档地址:http://cmusatyalab.github.io/openface/ openface的安 ...