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 相关文章推荐
解读IE和firefox下JScript和HREF的执行顺序
Jan 12 Javascript
javascript中callee与caller的用法和应用场景
Dec 08 Javascript
基于JQuery实现的Select级联
Jan 27 Javascript
一个JavaScript的求爱小特效
May 09 Javascript
使用jQuery的attr方法来修改onclick值
Jul 07 Javascript
JavaScript实现的石头剪刀布游戏源码分享
Aug 22 Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
Jul 20 Javascript
防止Node.js中错误导致进程阻塞的办法
Aug 11 Javascript
JavaScript变量提升和严格模式实例分析
Jan 27 Javascript
javascript设计模式之装饰者模式
Jan 30 Javascript
详解Node.js使用token进行认证的简单示例
May 25 Javascript
javascript中闭包closure的深入讲解
Mar 03 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伪静态写法附代码
2008/06/20 PHP
php使用explode()函数将字符串拆分成数组的方法
2015/02/17 PHP
Thinkphp整合微信支付功能
2016/12/14 PHP
PHP实现一个按钮点击上传多个图片操作示例
2020/01/23 PHP
jQuery getJSON 处理json数据的代码
2010/07/26 Javascript
jquery选择器(常用选择器说明)
2010/09/28 Javascript
深入理解Javascript闭包 新手版
2010/12/28 Javascript
js中获取事件对象的方法小结
2011/03/13 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
JavaScript实现横向滑出的多级菜单效果
2015/10/09 Javascript
canvas滤镜效果实现代码
2017/02/06 Javascript
ECMAscript 变量作用域总结概括
2017/08/18 Javascript
vue2里面ref的具体使用方法
2017/10/27 Javascript
详解JS转换数值函数Number()、parseInt()、parseFloat()
2018/08/24 Javascript
jquery实现动态创建form并提交的方法示例
2019/05/27 jQuery
基于Node.js的大文件分片上传示例
2019/06/19 Javascript
浅析Vue下的components模板使用及应用
2019/11/27 Javascript
jQuery 选择器用法实例分析【prev + next】
2020/05/22 jQuery
在vue中使用vant TreeSelect分类选择组件操作
2020/11/02 Javascript
Python 专题六 局部变量、全局变量global、导入模块变量
2017/03/20 Python
Python加密方法小结【md5,base64,sha1】
2017/07/13 Python
Python将多个excel表格合并为一个表格
2021/02/22 Python
python实现随机调用一个浏览器打开网页
2018/04/21 Python
python实现电脑自动关机
2018/06/20 Python
pandas 转换成行列表进行读取与Nan处理的方法
2018/10/30 Python
Python 操作mysql数据库查询之fetchone(), fetchmany(), fetchall()用法示例
2019/10/17 Python
导致python中import错误的原因是什么
2020/07/01 Python
优秀毕业生自我鉴定
2014/01/19 职场文书
电子商务专业学生职业生涯规划
2014/03/07 职场文书
《水上飞机》教学反思
2014/04/10 职场文书
军训口号
2014/06/13 职场文书
大学感恩节活动策划方案
2014/10/11 职场文书
死亡赔偿协议书
2015/01/28 职场文书
物业工程部主管岗位职责
2015/04/16 职场文书
商务信函英语问候语
2015/11/10 职场文书
《彼得与狼》教学反思
2016/02/20 职场文书