一文快速了解JQuery中的AJAX


Posted in jQuery onMay 31, 2019
$.ajax({
  url:"http://www.microsoft.com",  //请求的url地址
  dataType:"json",  //返回格式为json
  async:true,//请求是否异步,默认为异步,这也是ajax重要特性
  data:{"id":"value"},  //参数值
  type:"GET",  //请求方式
  beforeSend:function(){
    //请求前的处理
  },
  success:function(req){
    //请求成功时处理
  },
  complete:function(){
    //请求完成的处理
  },
  error:function(){
    //请求出错处理
  }
});

ajax方法常用参数

1.url:

要求为String类型的参数,(默认为当前页地址)发送请求的地址。

2.type:

要求为String类型的参数,请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。

3.async:

要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为false。注意,同步请求将锁住浏览器,用户其他操作必须等待请求完成才可以执行。

4.data:

要求为Object或String类型的参数,发送到服务器的数据。如果已经不是字符串,将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换,可以查看

processData选项。对象必须为key/value格式,例如

{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组,JQuery将自动为不同值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2

5.dataType:

要求为String类型的参数,预期服务器返回的数据类型。如果不指定,JQuery将自动根据http包mime信息返回responseXML或responseText,并作为回调函数参数传递。可用的类型如下:
xml:返回XML文档,可用JQuery处理。
html:返回纯文本HTML信息;包含的script标签会在插入DOM时执行。
script:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时(不在同一个域下),所有post请求都将转为get请求。
json:返回JSON数据。
jsonp:JSONP格式。使用SONP形式调用函数时,例如myurl?callback=?,JQuery将自动替换后一个“?”为正确的函数名,以执行回调函数。
text:返回纯文本字符串。

6.beforeSend:

要求为Function类型的参数,发送请求前可以修改XMLHttpRequest对象的函数,例如添加自定义HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参数。   

function(XMLHttpRequest){
        this;  //调用本次ajax请求时传递的options参数
      }

7.complete:

要求为Function类型的参数,请求完成后调用的回调函数(请求成功或失败时均调用)。参数:XMLHttpRequest对象和一个描述成功请求类型的字符串。

function(XMLHttpRequest, textStatus){
       this;  //调用本次ajax请求时传递的options参数
     }

8.success:

要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。

         (1)由服务器返回,并根据dataType参数进行处理后的数据。
         (2)描述状态的字符串。       

function(data, textStatus){
      //data可能是xmlDoc、jsonObj、html、text等等
      this; //调用本次ajax请求时传递的options参数
     }

9.error:

要求为Function类型的参数,请求失败时被调用的函数。该函数有3个参数,即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下:

function(XMLHttpRequest, textStatus, errorThrown){
     //通常情况下textStatus和errorThrown只有其中一个包含信息
     this;  //调用本次ajax请求时传递的options参数
    }

总结

以上所述是小编给大家介绍的JQuery中的AJAX,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

jQuery 相关文章推荐
jquery实现图片轮播器
May 23 jQuery
jQuery Datatables表头不对齐的解决办法
Nov 27 jQuery
jQuery实现简单的下拉菜单导航功能示例
Dec 07 jQuery
jQuery中将json数据显示到页面表格的方法
May 27 jQuery
详解jQuery中的getAll()和cleanData()
Apr 15 jQuery
jquery实现垂直无限轮播的方法分析
Jul 16 jQuery
如何使用Jquery动态生成二级选项列表
Feb 06 jQuery
基于ajax及jQuery实现局部刷新过程解析
Sep 12 jQuery
jquery实现简易验证插件封装
Sep 13 jQuery
IDEA配置jQuery, $符号不再显示黄色波浪线的问题
Oct 09 jQuery
jquery实现抽奖功能
Oct 22 jQuery
jQuery实现动态加载(按需加载)javascript文件的方法分析
May 31 #jQuery
jQuery模拟html下拉多选框的原生实现方法示例
May 30 #jQuery
JS拖动选择table里的单元格完整实例【基于jQuery】
May 28 #jQuery
jquery实现Ajax请求的几种常见方式总结
May 28 #jQuery
jquery操作select常见方法大全【7种情况】
May 28 #jQuery
jQuery实现高级检索功能
May 28 #jQuery
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 #jQuery
You might like
用PHPdig打造属于你自己的Google[图文教程]
2007/02/14 PHP
Wordpress 相册插件 NextGEN-Gallery 添加目录将中文转为拼音的解决办法
2010/12/29 PHP
php5.5中类级别的常量使用介绍
2013/10/02 PHP
JavaScript在IE和Firefox浏览器下的7个差异兼容写法小结
2010/06/18 Javascript
解析John Resig Simple JavaScript Inheritance代码
2012/12/03 Javascript
基于Jquery实现表单验证
2020/07/20 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
2015/08/06 Javascript
Nodejs Express4.x开发框架随手笔记
2015/11/23 NodeJs
js实现网页图片延时加载 提升网页打开速度
2016/01/26 Javascript
不同js异步函数同步的实现方法
2016/05/28 Javascript
AngularJS基础 ng-cloak 指令简单示例
2016/08/01 Javascript
微信小程序开发之实现选项卡(窗口顶部TabBar)页面切换
2016/11/25 Javascript
使用BootStrap实现悬浮窗口的效果
2016/12/13 Javascript
微信小程序返回多级页面的实现方法
2017/10/27 Javascript
JavaScript使用类似break机制中断forEach循环的方法
2018/11/13 Javascript
JavaScript ES6中的简写语法总结与使用技巧
2018/12/30 Javascript
js获取图片的base64编码并压缩
2020/12/05 Javascript
[00:12]2018DOTA2亚洲邀请赛 sylar表现SOLO技艺
2018/04/06 DOTA
详解Python3中yield生成器的用法
2015/08/20 Python
Python设计模式编程中解释器模式的简单程序示例分享
2016/03/02 Python
Selenium 模拟浏览器动态加载页面的实现方法
2018/05/16 Python
Python 中字符串拼接的多种方法
2018/07/30 Python
opencv python 基于KNN的手写体识别的实例
2018/08/03 Python
详解Python list和numpy array的存储和读取方法
2019/11/06 Python
Python中低维数组填充高维数组的实现
2019/12/02 Python
突破canvas语法限制 让他支持链式语法
2012/12/24 HTML / CSS
总经理助理职责
2014/02/04 职场文书
万年牢教学反思
2014/02/15 职场文书
航海技术专业毕业生推荐信
2014/07/09 职场文书
少先队入队仪式主持词
2015/07/04 职场文书
致接力运动员加油稿
2015/07/21 职场文书
妇产科护理心得体会
2016/01/22 职场文书
《我和小伙伴》教学反思
2016/02/20 职场文书
基于nginx实现上游服务器动态自动上下线无需reload的实现方法
2021/03/31 Servers
CSS3实现列表无限滚动/轮播效果
2021/06/23 HTML / CSS
Vue的生命周期一起来看看
2022/02/24 Vue.js