$.ajax用法与举例

时间:2022-02-10 01:39:54

下面是一段比较常用到的 $.ajax 方法:

 $.ajax({
type:'GET',
url:'http://www.phpernote.com/jquery.php',
data:{username:'phpernote',password:'123456'},
dataType:'json',
timeout:3000,
cache:false,
async:true,
beforeSend:function(){
alert('请求之前');
},
success:function(data){
alert('请求成功');
},
error:function(msg){
alert('请求发生错误');
}
});
 

以上代码只使用到了比较常见的一些参数和处理函数,下面将 $.ajax 方法中所有的参数和函数异议列举下:

参数:

url 类型:String,默认值: 当前页地址。发送请求的地址。

type 类型:String,取值有 "POST" 或 "GET" 两种,默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。

async 类型:Boolean,默认值为 true。默认设置下,所有请求均为异步请求(即在执行该ajax请求之时,不管该请求是否执行完毕,将继续执行下面的代码)。如果需要发送同步请求,请将此选项设置为 false。如果在需求中遇到一些处理代码在ajax请求之后,并且这些处理依赖于ajax的请求结果时,则在这个地方最好设置值为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

cache 类型:Boolean,默认值为 true,当参数 dataType 设置为 script 或 jsonp 时默认为 false。设置为 false 的情况下在多次请求时将不缓存上一次的请求数据。jQuery 1.2 新增加的功能。

contentType 类型:String,默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型,也可设置为 "application/json; charset=utf-8"。默认值适合大多数情况。如果你明确地传递了一个 content-type 给 $.ajax() 那么它必定会发送给服务器(即使没有数据要发送)。

data 类型:String,发送到服务器的数据。一般格式为{key1:value1,key2,value2},如果为数组,jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2',如果没有值的话,可直接为空{}。

dataType 类型:String,指定服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。在 1.4 中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。该参数的值有以下可选:

"xml": 返回 XML 文档,可用 jQuery 处理。 
"html": 返回纯文本 HTML 信息;包含的 script 标签会在插入 dom 时执行。 
"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意:在远程请求时(不在同一个域下),所有 POST 请求都将转为 GET 请求。(因为将使用 DOM 的 script标签来加载) 
"json": 返回 JSON 数据 。 
"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。 
"text": 返回纯文本字符串

ifModified 类型:Boolean,仅在服务器数据改变时获取新数据。默认值: false。使用 HTTP 包 Last-Modified 头信息判断。在 jQuery 1.4 中,它也会检查服务器指定的 'etag' 来确定数据没有被修改过。

timeout 类型:Number,设置请求超时时间(单位:毫秒)。此设置将覆盖全局设置。

global 类型:Boolean,是否触发全局 AJAX 事件。默认值: true。设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。

processData 类型:Boolean,默认值: true。默认情况下,通过data选项传递进来的数据,如果是一个对象(技术上讲只要不是字符串),都会处理转化成一个查询字符串,以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。

jsonpCallback 为 jsonp 请求指定一个回调函数名。这个值将用来取代 jQuery 自动生成的随机函数名。这主要用来让 jQuery 生成度独特的函数名,这样管理请求更容易,也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存 GET 请求的时候,指定这个回调函数名。

处理函数:

beforeSend(XMLHttpRequest) 发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头。XMLHttpRequest 对象是唯一的参数。这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求。

complete(XHR,TS) 请求完成(不管是否成功)后回调函数。参数: XMLHttpRequest 对象和一个描述请求类型的字符串。

dataFilter 给 Ajax 返回的原始数据的进行预处理的函数。提供 data 和 type 两个参数:data 是 Ajax 返回的原始数据,type 是调用 jQuery.ajax 时提供的 dataType 参数。函数返回的值将由 jQuery 进一步处理。

error 默认值: 自动判断 (xml 或 html)。请求失败时将调用此函数。有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。如果发生了错误,错误信息(第二个参数)除了得到 null 之外,还可能是 "timeout", "error", "notmodified" 和 "parsererror"。

success 请求成功后的回调函数。参数:由服务器返回,并根据 dataType 参数进行处理后的数据;描述状态的字符串。

xhr 需要返回一个 XMLHttpRequest 对象。默认在 IE 下是 ActiveXObject 而其他情况下是 XMLHttpRequest 。用于重写或者提供一个增强的 XMLHttpRequest 对象。这个参数在 jQuery 1.3 以前不可用。

上面所介绍的一些参数并不是全部的参数,还有一些不常用的,由于工作中用到的不多就没有写进去。

随机推荐

  1. jquery 中的框架

    DWZ 国产Ajax RIA开源框架 Ninja UI 框架    提供页面插件 angela ui框架  表单布局等 Chico UI    快速页面布局  PrimeUI    w2ui   布局 ...

  2. 说说Python中的闭包 - Closure

    转载自https://segmentfault.com/a/1190000007321972 Python中的闭包不是一个一说就能明白的概念,但是随着你往学习的深入,无论如何你都需要去了解这么一个东西 ...

  3. 第七十九,CSS3背景渐变效果

    CSS3背景渐变效果 学习要点: 1.线性渐变 2.径向渐变 本章主要探讨HTML5中CSS3背景渐变功能,主要有两种渐变方式:线性渐变和径向 (放射性)渐变. 一.线性渐变 linear-gradi ...

  4. 各开放平台API接口通用SDK序列文章 前言

    最近两年一直在做API接口相关的工作,在平时工作中以及网上看到很多刚接触API接口调用的新人一开始会感到很不适应,要看的文档一大堆,自己要调用的接口找不着,或都找着了不知道怎么去调用,记得包括自己刚开 ...

  5. 11个优秀的Android开发开源项目

    一. 一个类似微信的时光轴效果   时光轴效果 项目地址 https://github.com/ljtyzhr/TimeLine 二. 安卓选择器类库,包括日期.时间.单项.双项选择器.城市地址选择器 ...

  6. Cocoa练习01:一个简单的Todo list程序

    写一个简单的todo list程序,界面如下图: 在TextField区域输入文字,点击Add按钮会将文字显示在下面的TableView列表中.TableView列表有2列,第一列是文字的输入时间:第 ...

  7. 5.21http网页基础

    1,HTML的由来: web网页开发的标准,由w3c万维网联盟组织制定的.是制作网页的规范标准,分为结构标准.表现标准.行为标准.结构:html.表现:css.行为:Javascript. 2,htm ...

  8. 百度离线下载Tampermonkey脚本

    https://greasyfork.org/zh-CN/scripts/23635-%E7%99%BE%E5%BA%A6%E7%BD%91%E7%9B%98%E7%9B%B4%E6%8E%A5%E4 ...

  9. HOG目标检测

    用HOG进行行人检测时,需要用训练好的支持向量机来对图片进行分类,在opencv中,支持向量机已经训练好,但自己来训练支持向量机才能更好的体会这一过程. 参考:http://blog.csdn.net ...

  10. java质量提升相关

    http://blog.sina.com.cn/s/blog_6814a1510102v2rp.html