jquery实现Ajax请求的几种常见方式总结


Posted in jQuery onMay 28, 2019

本文实例讲述了jquery实现Ajax请求的几种常见方式。分享给大家供大家参考,具体如下:

用原生的javascript开发ajax有着许多重复的代码,当然你也可以封装成可以复用的js代码,但却不一定那么通用。但jquery  提供的几种AJAX请求的几种方式,从简单到复杂,有更多的选择空间,下面总结几种在项目中常用的jquery ajax请求的方式,由于AJAX 与语言不相关,所以省略后台语言部分,重点放在前端。

1. 用jquery 的 load() 方法实现ajax请求
2. 用jquery 的 post() ,get() 方法
3. 用jquery 的 Ajax() 方法,这个最强悍.

1. 用jquery 的 load() 方法实现ajax请求

格式如下:

$('#mydiv').load('/myrequest/url/param')

这里的 "mydiv" 是要加载内容的区域 /myrequest/url/param 是你要请求的服务端的 URL. 一旦得到结果,就会把服务端返回的内容显示在 mydiv 区域中.

2. 用jquery 的 post() ,get() 方法

其实这也就是对应 http 请求中的 POST,GET,

基本格式如下

$post('/myrequest/url/param',
     {
      text:"mytext",
      other:"other_param"
     },
      // 调用服务端成功后的回调函数
      function(){
       alert('succeccd');
     }
)

$get 的操作方式类似.就不在多说了.

3. 用jquery 的 Ajax() 方法

这个估计也是一般项目中最常见的请求方法了,因为他的功能最强大,能完成各种需求的ajax请求:

可以指定返回的类型: xml,html,或者json 格式

可以指定 beforeSend,error,success,complete 这些事件发生时的回调函数

可以用参数来指定ajax 请求过期的时间,比如服务端没有响应等.

基本格式如下:

$.ajax({
    async:false,//同步,异步
    url:"/addjoke", //请求的服务端地址
    data:{
       content:mycontent,
       title:joketitle,
       d:Math.random()
       },
    type:"post",
    dataType:"text",
    success:function(data){
      //成功之后的处理,返回的数据就是 data
    }
    error:function(){
      alert('error'); //错误的处理
    }
  });

这些东西不需要死记硬背,知道有这么个东西就行了,用的时候拿出来参考下就好了,jquery的ajax请求就这么几种方式,看实际情况自己选择采用哪种方式.

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

jQuery 相关文章推荐
jQuery插件FusionCharts绘制的3D双柱状图效果示例【附demo源码】
Apr 20 jQuery
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 jQuery
jQuery实现的下雪动画效果示例【附源码下载】
Feb 02 jQuery
jQuery无冲突模式详解
Jan 17 jQuery
基于jquery实现的tab选项卡功能示例【附源码下载】
Jun 10 jQuery
jQuery实现checkbox全选、反选及删除等操作的方法详解
Aug 02 jQuery
Jquery实现获取子元素的方法分析
Aug 24 jQuery
jquery.tagsinput.js实现记录checkbox勾选的顺序
Sep 21 jQuery
jquery 遍历hash操作示例【基于ajax交互】
Oct 12 jQuery
jQuery实现消息弹出框效果
Dec 10 jQuery
jquery html添加元素/删除元素操作实例详解
May 20 jQuery
jQuery实现电梯导航模块
Dec 22 jQuery
jquery操作select常见方法大全【7种情况】
May 28 #jQuery
jQuery实现高级检索功能
May 28 #jQuery
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 #jQuery
jquery实现动态创建form并提交的方法示例
May 27 #jQuery
jquery实现动态改变css样式的方法分析
May 27 #jQuery
通过jQuery学习js类型判断的技巧
May 27 #jQuery
jQuery中使用validate插件校验表单功能
May 24 #jQuery
You might like
php版淘宝网查询商品接口代码示例
2014/06/17 PHP
php微信开发之带参数二维码的使用
2016/08/03 PHP
PHP实现的堆排序算法详解
2017/08/17 PHP
ThinkPHP5.0框架实现切换数据库的方法分析
2019/10/30 PHP
PHP框架实现WebSocket在线聊天通讯系统
2019/11/21 PHP
Prototype 1.5.0_rc1 及 Prototype 1.5.0 Pre0小抄本
2006/09/22 Javascript
jquery显示和隐藏div特效实例
2013/02/27 Javascript
js中parseInt函数浅谈
2013/07/31 Javascript
JS复制内容到剪切板的实例代码(兼容IE与火狐)
2013/11/19 Javascript
jQuery中:header选择器用法实例
2014/12/29 Javascript
什么是JavaScript注入攻击?
2016/09/14 Javascript
jQuery插件echarts实现的单折线图效果示例【附demo源码下载】
2017/03/04 Javascript
JavaScript实现弹出广告功能
2017/03/30 Javascript
彻底解决 webpack 打包文件体积过大问题
2017/07/07 Javascript
JavaScript 自定义事件之我见
2017/09/25 Javascript
解析Json字符串的三种方法日常常用
2018/05/02 Javascript
Vue数据双向绑定原理及简单实现方法
2018/05/18 Javascript
Vue自定义属性实例分析
2019/02/23 Javascript
JS实现li标签的删除
2019/04/12 Javascript
JS原生瀑布流效果实现
2019/04/26 Javascript
分析python服务器拒绝服务攻击代码
2014/01/16 Python
python实现马耳可夫链算法实例分析
2015/05/20 Python
Python中你应该知道的一些内置函数
2017/03/31 Python
Python使用剪切板的方法
2017/06/06 Python
Python父目录、子目录的相互调用方法
2019/02/16 Python
Python3 实现减少可调用对象的参数个数
2019/12/20 Python
基于HTML5+CSS3实现简单的时钟效果
2017/09/11 HTML / CSS
美国最大的香水连锁店官网:Perfumania
2016/08/15 全球购物
Oracle里面常用的数据字典有哪些
2014/02/14 面试题
新闻专业应届生求职信
2013/10/31 职场文书
大学生交通专业求职信
2014/09/01 职场文书
2014中学教师节广播稿
2014/09/10 职场文书
小班上学期幼儿评语
2014/12/30 职场文书
2016创先争优活动党员公开承诺书
2016/03/24 职场文书
win10+anaconda安装yolov5的方法及问题解决方案
2021/04/29 Python
微信小程序实现聊天室功能
2021/06/14 Javascript