jQuery基于ajax()使用serialize()提交form数据的方法


Posted in Javascript onDecember 08, 2015

本文实例讲述了jQuery基于ajax()使用serialize()提交form数据的方法。分享给大家供大家参考,具体如下:

jQuery的serialize()方法通过序列化表单值,创建URL编码文本字符串,我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化,如:

<form action="">
First name: <input type="text" name="FirstName" value="Bill" /><br />
Last name: <input type="text" name="LastName" value="Gates" /><br />
</form>
<script>
$(document).ready(function(){
 console.log($("form").serialize());
 // FirstName=Bill&LastName=Gates
});
</script>

这样,我们就可以把序列化的值传给ajax()作为url的参数,轻松使用ajax()提交form表单了,而不需要一个一个获取表单中的值然后传给ajax(),举例如下:

$.ajax({
 type: 'post',
 url: 'your url',
 data: $("form").serialize(),
 success: function(data) {
  // your code
 }
});

使用$.post()、$.get()和$.getJSON()也是一样的:

$.post('your url', $("form").serialize(), function(data) {
  // your code
 }
});
$.get('your url', $("form").serialize(), function(data) {
  // your code
 }
});
$.getJSON('your url', $("form").serialize(), function(data) {
  // your code
 }
});

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
对xmlHttp对象方法和属性的理解
Jan 17 Javascript
jQuery遍历json的方法(推荐)
Jun 12 Javascript
javaScript如何跳出多重循环break、continue
Sep 01 Javascript
JS多物体实现缓冲运动效果示例
Dec 20 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
详解vue父子模版嵌套案例
Mar 04 Javascript
JavaScript实现弹窗效果代码分析
Mar 09 Javascript
基于Bootstrap分页的实例讲解(必看篇)
Jul 04 Javascript
Vue.js单向绑定和双向绑定实例分析
Aug 14 Javascript
RequireJS用法简单示例
Aug 20 Javascript
又拍云 Node.js 实现文件上传、删除功能
Oct 28 Javascript
extjs图表绘制之条形图实现方法分析
Mar 06 Javascript
jQuery的Ajax用户认证和注册技术实例教程(附demo源码)
Dec 08 #Javascript
jquery+ajax实现注册实时验证实例详解
Dec 08 #Javascript
jQuery使用$.ajax进行即时验证的方法
Dec 08 #Javascript
基于JavaScript创建动态Dom
Dec 08 #Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
Dec 08 #Javascript
JS判断当前页面是否在微信浏览器打开的方法
Dec 08 #Javascript
js实现兼容IE、Firefox的图片缩放代码
Dec 08 #Javascript
You might like
php中使用接口实现工厂设计模式的代码
2012/06/17 PHP
php curl 上传文件代码实例
2015/04/27 PHP
PHP判断表达式中括号是否匹配的简单实例
2016/10/22 PHP
ecshop适应在PHP7的修改方法解决报错的实现
2016/11/01 PHP
Laravel jwt 多表(多用户端)验证隔离的实现
2019/12/18 PHP
jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码
2011/04/27 Javascript
js 遍历对象的属性的代码
2011/12/29 Javascript
onbeforeunload与onunload事件异同点总结
2013/06/24 Javascript
ext前台接收action传过来的json数据示例
2014/06/17 Javascript
javascript正则表达式使用replace()替换手机号的方法
2015/01/19 Javascript
JavaScript基础函数整理汇总
2015/01/30 Javascript
javascript中使用new与不使用实例化对象的区别
2015/06/22 Javascript
JS之获取样式的简单实现方法(推荐)
2016/09/13 Javascript
Javascript中引用类型传递的知识点小结
2017/03/06 Javascript
微信小程序实现手势图案锁屏功能
2018/01/30 Javascript
新年快乐! javascript实现超级炫酷的3D烟花特效
2019/01/30 Javascript
Python 开发Activex组件方法
2009/11/08 Python
Python求导数的方法
2015/05/09 Python
python开发之list操作实例分析
2016/02/22 Python
Python安装第三方库及常见问题处理方法汇总
2016/09/13 Python
Python将8位的图片转为24位的图片实现方法
2018/10/24 Python
使用python 打开文件并做匹配处理的实例
2019/01/02 Python
python并发编程多进程 模拟抢票实现过程
2019/08/20 Python
python使用beautifulsoup4爬取酷狗音乐代码实例
2019/12/04 Python
详解python对象之间的交互
2020/09/29 Python
细说NumPy数组的四种乘法的使用
2020/12/18 Python
俄罗斯有趣和原创礼物网上商店:MagicMag
2019/08/01 全球购物
求职信内容考虑哪几点
2013/10/05 职场文书
会计自我鉴定
2014/02/04 职场文书
《小壁虎借尾巴》教学反思
2014/02/16 职场文书
会议主持词
2014/03/17 职场文书
党员干部承诺书
2014/03/25 职场文书
应届毕业生自荐信
2014/05/28 职场文书
乡镇领导班子四风对照检查材料
2014/09/27 职场文书
小学运动会报道稿
2014/10/04 职场文书
教你用python实现12306余票查询
2021/06/30 Python