一文快速了解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 submit()不能提交表单的解决方法
Apr 24 jQuery
jQuery Layer弹出层传值到父页面的实现代码
Aug 17 jQuery
Mui使用jquery并且使用点击跳转新窗口的实例
Aug 19 jQuery
jQuery实现checkbox即点即改批量删除及中间遇到的坑
Nov 11 jQuery
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
jquery 动态遍历select 赋值的实例
Sep 12 jQuery
jquery实现联想词搜索框和搜索结果分页的示例
Oct 10 jQuery
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 jQuery
JQuery中queue方法用法示例
Jan 31 jQuery
[jQuery] 事件和动画详解
Mar 05 jQuery
jQuery实现查看图片功能
Dec 01 jQuery
jQuery实现影院选座订座效果
Apr 13 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
新版PHP将向Java靠拢
2006/10/09 PHP
yii中widget的用法
2014/12/03 PHP
详解php用curl调用接口方法,get和post两种方式
2017/01/13 PHP
yii2 在控制器中验证请求参数的使用方法
2019/06/19 PHP
php用wangeditor3实现图片上传功能
2019/08/22 PHP
Javascript注入技巧
2007/06/22 Javascript
使用非html5实现js板连连看游戏示例代码
2013/09/22 Javascript
jQuery学习笔记之基础中的基础
2015/01/19 Javascript
JS+CSS实现带小三角指引的滑动门效果
2015/09/22 Javascript
JavaScript匿名函数之模仿块级作用域
2015/12/12 Javascript
基于JavaScript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象)
2015/12/28 Javascript
基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载
2016/01/06 Javascript
jQuery Easy UI中根据第一个下拉框选中的值设置第二个下拉框是否可以编辑
2016/11/29 Javascript
js实现文字选中分享功能
2017/01/25 Javascript
webpack4与babel配合使es6代码可运行于低版本浏览器的方法
2018/10/12 Javascript
vue+iview动态渲染表格详解
2019/03/19 Javascript
vue+elementUi图片上传组件使用详解
2019/08/20 Javascript
详解JS函数防抖
2020/06/05 Javascript
vue+element-ui表格封装tag标签使用插槽
2020/06/18 Javascript
JS自定义右键菜单实现代码解析
2020/07/16 Javascript
前端如何实现动画过渡效果
2021/02/05 Javascript
Django视图和URL配置详解
2018/01/31 Python
Django中url的反向查询的方法
2018/03/14 Python
解决Django数据库makemigrations有变化但是migrate时未变动问题
2018/05/30 Python
Pytorch中的variable, tensor与numpy相互转化的方法
2019/10/10 Python
将数据集制作成VOC数据集格式的实例
2020/02/17 Python
如何在vscode中安装python库的方法步骤
2021/01/06 Python
HTML5中的强制下载属性download使用实例解析
2016/05/12 HTML / CSS
Expedia印度:您的一站式在线旅游网站
2017/08/24 全球购物
Servlet方面面试题
2016/09/28 面试题
材料加工硕士生求职信
2013/10/10 职场文书
学生励志演讲稿
2014/01/06 职场文书
经典团队口号
2014/06/06 职场文书
老公给老婆的检讨书(精华篇)
2014/10/18 职场文书
2015-2016年小学教导工作总结
2015/07/21 职场文书
详解Go语言中Get/Post请求测试
2022/06/01 Golang