转载自： http://blog.csdn.net/zqtsx/article/details/28655717
原始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>
