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 相关文章推荐
jquery 将disabled的元素置为enabled的三种方法
Jul 25 Javascript
基于jQuery的星级评分插件
Aug 12 Javascript
a标签click和href执行顺序探讨
Jun 23 Javascript
JavaScript搜索字符串并将搜索结果返回到字符串的方法
Apr 06 Javascript
介绍JavaScript的一个微型模版
Jun 24 Javascript
JS使用cookie实现DIV提示框只显示一次的方法
Nov 05 Javascript
图文详解Heap Sort堆排序算法及JavaScript的代码实现
May 04 Javascript
JavaScript该如何学习 怎样轻松学习JavaScript
Jun 12 Javascript
jQuery实现一个简单的验证码功能
Jun 26 jQuery
Vue之Vue.set动态新增对象属性方法
Feb 23 Javascript
node前端模板引擎Jade之标签的基本写法
May 11 Javascript
JS高阶函数原理与用法实例分析
Jan 15 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
全国FM电台频率大全 - 6 辽宁省
2020/03/11 无线电
php数组函数序列之ksort()对数组的元素键名进行升序排序,保持索引关系
2011/11/02 PHP
Thinkphp中volist标签mod控制一定记录的换行BUG解决方法
2014/11/04 PHP
mod_php、FastCGI、PHP-FPM等PHP运行方式对比
2015/07/02 PHP
php下载文件超时时间的设置方法
2016/10/06 PHP
PHP简单实现防止SQL注入的方法
2018/03/13 PHP
PHP+jQuery实现双击修改table表格功能示例
2019/02/21 PHP
浅谈laravel 5.6 安装 windows上使用composer的安装过程
2019/10/18 PHP
js异常捕获方法介绍
2013/04/10 Javascript
自制的文件上传JS控件可支持IE、chrome、firefox etc
2014/04/18 Javascript
jQuery+CSS3文字跑马灯特效的简单实现
2016/06/25 Javascript
微信小程序商城项目之淘宝分类入口(2)
2017/04/17 Javascript
浅析JS中常用类型转换及运算符表达式
2017/07/23 Javascript
推荐10款扩展Web表单的JS插件
2017/12/25 Javascript
JS实现的JSON数组去重算法示例
2018/04/11 Javascript
基于vue手写tree插件的那点事儿
2019/08/20 Javascript
vue 设置 input 为不可以编辑的实现方法
2019/09/19 Javascript
vue 使用鼠标滚动加载数据的例子
2019/10/31 Javascript
教你学会使用Python正则表达式
2017/09/07 Python
python中print()函数的“,”与java中System.out.print()函数中的“+”功能详解
2017/11/24 Python
Python pandas常用函数详解
2018/02/07 Python
用Python和WordCloud绘制词云的实现方法(内附让字体清晰的秘笈)
2019/01/08 Python
使用python的pandas为你的股票绘制趋势图
2019/06/26 Python
Python Web项目Cherrypy使用方法镜像
2020/11/05 Python
HTML5 常用语法一览(列举不支持的属性)
2010/01/26 HTML / CSS
Omio波兰:全欧洲低价大巴、火车和航班搜索和比价
2018/02/16 全球购物
劳力士官方珠宝商:J.R. Dunn Jewelers
2018/09/29 全球购物
澳大利亚设计的优质鞋类和适合澳大利亚生活方式的服装:Rivers
2019/04/23 全球购物
马来西亚在线健康商店:Medipal Malaysia
2020/04/13 全球购物
经济学博士求职自荐信范文
2013/11/23 职场文书
中秋节礼品促销方案
2014/02/02 职场文书
黄金搭档广告词
2014/03/21 职场文书
中考标语大全
2014/06/05 职场文书
协会周年庆活动方案
2014/08/26 职场文书
二手车交易协议书标准版
2014/11/16 职场文书
刑事辩护词范文
2015/05/21 职场文书