Jquery操作Ajax方法小结


Posted in Javascript onNovember 29, 2015

ajax() 方法通过 HTTP 请求加载远程数据。

该方法是 jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。

最简单的情况下,$.ajax() 可以不带任何参数直接使用。

注意:所有的选项都可以通过 $.ajaxSetup() 函数来全局设置。

语法

jQuery.ajax([settings])

参数 描述
settings 可选。用于配置 Ajax 请求的键值对集合。 可以通过 $.ajaxSetup() 设置任何选项的默认值。

jQuery.get()

使用一个HTTP GET 请求从服务器加载数据。

jQuery.get(url [,data] [,success(data,textStatus,jqXHR)] [dtaType])

url 一个包含发送请求的URL

data 发送给服务器的字符串后键值对

success() 当请求成功时回调的函数

dataType 从服务器返回的预期数据。

用法:

$.get("test.cgi", { name: "John", time: "2pm" },

function(data){



alert("Data Loaded: " + data);

});

jQuery.getJSON()

使用一个HTTP GET 请求服务器加载JSON 编码的数据。

jQuery.getJSON(url [,data] [,success(data,textStatus,jqXHR)])

url 一个包含发送请求的URL

data 发送给服务器的字符串后键值对

success() 当请求成功时回调的函数

jQuery.getScript()

使用一个HTTP GET请求从服务器加载并执行一个JavaScript文件。

jQuery.getScript(url[success(script,textStatus,jqXHR)])

url 一个包含发送请求的URL

data 发送给服务器的字符串后键值对

用法:

$.getScript("ajax/test.js", function(data, textStatus, jqxhr) {


console.log(data); //data returned


console.log(textStatus); //success


console.log(jqxhr.status); //200


console.log('Load was performed.');

});

jQuery.post([settings])

使用一个HTTP POST请求从服务器加载数据。

jQuery.post(url[,data][,success(data,textStatus,jqXHR)][,dataType])

url 一个包含发送请求的URL

data 发送给服务器的字符串后键值对

success() 当请求成功时回调的函数

用法:

$.post("test.php", { name: "John", time: "2pm" },



function(data) {




alert("Data Loaded: " + data);

});

.load()

从服务器载入数据并且将返回的HTML代码并插入至匹配的元素中。

.load(url[,data][,complete(responseText,textStatus,XMLHttpRequest)])

url 一个包含发送请求的URL

data 发送给服务器的字符串后键值对

complete 当请求成功时回调的函数

用法:

$('#result').load('ajax/test.html #container');

jQuery.ajax()

执行一个异步的HTTP(ajax)的请求。

参数:

url 类型: Sting 发送请求的地址(默认当前页面)

type 类型:Sting (默认为GET) 请求方式(”POST“或”GET“)

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

async 类型:Boolean 默认设置(true)默认设置下所有请求均为一步请求,如果需要同步请求,设置为false。

beforeSend 类型:function 发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头。XMLHttpRequest 对象是唯一的参数。

cache 类型:Boolean  默认为(true) 设置为false 将不会从浏览器缓存中加载请求信息。

complete 类型:Function  请求完成后回调函数,(请求成功或失败时均调用)参数: XMLHttpRequest 对象,成功信息字符串。function (  XMLHttpRequest,

       textStatus) {this; // the options for this ajax request}

contentType  类型为:String  发送信息至服务器时内容编码类型,默认值适合大多数应用场合。

data 类型:Object String 发送到服务器的数据。将自动转换为请求字符串格式,GET请求附加在URL后

dataType 类型:String 预期服务器返回的数据类型, ”xml“返回XML文档。”html“返回纯文本信息,包含script 元素。”script“返回纯文本JavaScript 代码,不会自动缓存

结果。”json“返回JSON 数组。”jsonp“JSONP格式。

error 类型:function 请求失败时将调用此方法。

global  类型:Boolean 是否触发全局AJAX事件。默认为(true) 设置为false 将不会触发全局ajax 事件,可用于控制不同的AJAX事件。

ifModified 类型:Boolean  默认为false 仅在服务器数据改变时获取新数据。

processData 类型:Boolean  默认为(true)默认情况下,发送的数据发送的数据将被转换为对象(技术上讲并非字符串) 以配合默认内容类型 "application/x-www-form-            urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。

success  类型:Function  请求成功后回调函数。这个方法有两个参数:服务器返回数据,返回状态。

$(document).ready(function() {

jQuery("#clearCac").click(function() {



jQuery.ajax({




url: "/Handle/Do.aspx",




type: "post",




data: { id: '0' },




dataType: "json",




success: function(msg) {





alert(msg);




},



error: function(XMLHttpRequest, textStatus, errorThrown) {




alert(XMLHttpRequest.status);




alert(XMLHttpRequest.readyState);




alert(textStatus);



},



complete: function(XMLHttpRequest, textStatus) {




this; // 调用本次AJAX请求时传递的options参数


}

});

});
});

error事件返回的第一个参数XMLHttpRequest有一些有用的信息:

XMLHttpRequest.readyState:

状态码

0 - (未初始化)还没有调用send()方法

1 - (载入)已调用send()方法,正在发送请求

2 - (载入完成)send()方法执行完成,已经接收到全部响应内容

3 - (交互)正在解析响应内容

4 - (完成)响应内容解析完成,可以在客户端调用了

XMLHttpRequest.status:

1xx-信息提示
这些状态代码表示临时的响应。客户端在收到常规响应之前,应准备接收一个或多个1xx响应。
100-继续。
101-切换协议。
2xx-成功
这类状态代码表明服务器成功地接受了客户端请求。
200-确定。客户端请求已成功。
201-已创建。
202-已接受。
203-非权威性信息。
204-无内容。
205-重置内容。
206-部分内容。
3xx-重定向
客户端浏览器必须采取更多操作来实现请求。例如,浏览器可能不得不请求服务器上的不同的页面,或通过代理服务器重复该请求。
301-对象已永久移走,即永久重定向。
302-对象已临时移动。
304-未修改。
307-临时重定向。
4xx-客户端错误
发生错误,客户端似乎有问题。例如,客户端请求不存在的页面,客户端未提供有效的身份验证信息。400-错误的请求。
401-访问被拒绝。IIS定义了许多不同的401错误,它们指明更为具体的错误原因。这些具体的错误代码在浏览器中显示,但不在IIS日志中显示:
401.1-登录失败。
401.2-服务器配置导致登录失败。
401.3-由于ACL对资源的限制而未获得授权。
401.4-筛选器授权失败。
401.5-ISAPI/CGI应用程序授权失败。
401.7?访问被Web服务器上的URL授权策略拒绝。这个错误代码为IIS6.0所专用。
403-禁止访问:IIS定义了许多不同的403错误,它们指明更为具体的错误原因:
403.1-执行访问被禁止。
403.2-读访问被禁止。
403.3-写访问被禁止。
403.4-要求SSL。
403.5-要求SSL128。
403.6-IP地址被拒绝。
403.7-要求客户端证书。
403.8-站点访问被拒绝。
403.9-用户数过多。
403.10-配置无效。
403.11-密码更改。
403.12-拒绝访问映射表。
403.13-客户端证书被吊销。
403.14-拒绝目录列表。
403.15-超出客户端访问许可。
403.16-客户端证书不受信任或无效。
403.17-客户端证书已过期或尚未生效。
403.18-在当前的应用程序池中不能执行所请求的URL。这个错误代码为IIS6.0所专用。
403.19-不能为这个应用程序池中的客户端执行CGI。这个错误代码为IIS6.0所专用。
403.20-Passport登录失败。这个错误代码为IIS6.0所专用。
404-未找到。
404.0-(无)?没有找到文件或目录。
404.1-无法在所请求的端口上访问Web站点。
404.2-Web服务扩展锁定策略阻止本请求。
404.3-MIME映射策略阻止本请求。
405-用来访问本页面的HTTP谓词不被允许(方法不被允许)
406-客户端浏览器不接受所请求页面的MIME类型。
407-要求进行代理身份验证。
412-前提条件失败。
413?请求实体太大。
414-请求URI太长。
415?不支持的媒体类型。
416?所请求的范围无法满足。
417?执行失败。
423?锁定的错误。
5xx-服务器错误
服务器由于遇到错误而不能完成该请求。
500-内部服务器错误。
500.12-应用程序正忙于在Web服务器上重新启动。
500.13-Web服务器太忙。
500.15-不允许直接请求Global.asa。
500.16?UNC授权凭据不正确。这个错误代码为IIS6.0所专用。
500.18?URL授权存储不能打开。这个错误代码为IIS6.0所专用。
500.100-内部ASP错误。
501-页眉值指定了未实现的配置。
502-Web服务器用作网关或代理服务器时收到了无效响应。
502.1-CGI应用程序超时。
502.2-CGI应用程序出错。application.
503-服务不可用。这个错误代码为IIS6.0所专用。
504-网关超时。
505-HTTP版本不受支持。
jQuery.param()
创建一个数组,一个普通的对象,或一个jQuery对象的序列化表现形似,用于URL查询字符串或Ajax请求。
jQuery.param(obj)
obj 一个用来序列化的一个数组,一个普通的对象,或一个jQuery对象。
jQuery.param( obj, traditional )
obj 一个用来序列化的一个数组,一个普通的对象,或一个jQuery对象。
traditional
一个布尔值,指示是否执行了传统的“shallow”的序列化。
$.param({ a: [2,3,4] }) // "a[]=2&a[]=3&a[]=4"
$.param({ a: { b:1,c:2 }, d: [3,4,{ e:5 }] }) // "a[b]=1&a[c]=2&d[]=3&d[]=4&d[2][e]=5"

Javascript 相关文章推荐
js调用后台servlet方法实例
Jun 09 Javascript
JavaScript中检测变量是否存在遇到的一些问题
Nov 11 Javascript
window.print打印指定div实例代码
Dec 13 Javascript
JavaScript打印网页指定区域的例子
May 03 Javascript
仿百度联盟对联广告实现代码
Aug 30 Javascript
javascript在IE下trim函数无法使用的解决方法
Sep 12 Javascript
微信小程序 实战小程序实例
Oct 08 Javascript
bootstrap-table组合表头的实现方法
Sep 07 Javascript
详解基于vue的服务端渲染框架NUXT
Jun 20 Javascript
QQ跳转支付宝并自动领红包脚本(最新)
Jun 22 Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
Oct 30 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
jquery+php实现滚动的数字特效
Nov 29 #Javascript
MVC Ajax Helper或Jquery异步加载部分视图
Nov 29 #Javascript
Javascript闭包实例详解
Nov 29 #Javascript
jQuery实现图片上传和裁剪插件Croppie
Nov 29 #Javascript
javascript高级编程之函数表达式 递归和闭包函数
Nov 29 #Javascript
javascript实现拖动元素交换位置
Nov 29 #Javascript
javascript实现网页中涉及的简易运动(改变宽高、透明度、位置)
Nov 29 #Javascript
You might like
中国收音机工业发展史
2021/03/02 无线电
php比较多维数组中值的大小排序实现代码
2012/09/08 PHP
php常用字符串处理函数实例分析
2014/11/22 PHP
ThinkPHP中url隐藏入口文件后接收alipay传值的方法
2014/12/09 PHP
PHP和Shell实现检查SAMBA与NFS Server是否存在
2015/01/07 PHP
phpStudy2016 配置多个域名期间遇到的问题小结
2017/10/19 PHP
浅谈PHPANALYSIS提取关键字
2019/03/08 PHP
JavaScript 错误处理与调试经验总结
2010/08/10 Javascript
javascript 正则表达式相关应介绍
2012/11/27 Javascript
JqueryMobile动态生成listView并实现刷新的两种方法
2014/03/05 Javascript
基于js实现投票的实例代码
2015/08/04 Javascript
JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)
2016/12/14 Javascript
浅谈jQuery中事情的动态绑定
2017/02/12 Javascript
微信小程序左右滑动切换页面详解及实例代码
2017/02/28 Javascript
vue超时计算的组件实例代码
2018/07/09 Javascript
解决vue数组中对象属性变化页面不渲染问题
2018/08/09 Javascript
layui实现table加载的示例代码
2018/08/14 Javascript
详解vue中使用vue-quill-editor富文本小结(图片上传)
2019/04/24 Javascript
vue路由跳转传参数的方法
2019/05/06 Javascript
Vue过渡效果之CSS过渡详解(结合transition,animation,animate.css)
2020/02/05 Javascript
在vue中axios设置timeout超时的操作
2020/09/04 Javascript
[40:03]RNG vs VG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python的函数嵌套的使用方法
2014/01/24 Python
Python的动态重新封装的教程
2015/04/11 Python
利用python3随机生成中文字符的实现方法
2017/11/24 Python
Django中自定义admin Xadmin的实现代码
2019/08/09 Python
纪伊国屋泰国网上书店:Kinokuniya泰国
2017/12/24 全球购物
大学生水文观测实习自我鉴定
2013/09/29 职场文书
文案策划求职信
2014/04/14 职场文书
最常使用的求职信
2014/05/25 职场文书
小学美术兴趣小组活动总结
2014/07/07 职场文书
银行员工犯错检讨书
2014/09/16 职场文书
小英雄雨来观后感
2015/06/09 职场文书
2016年社区植树节活动总结
2016/03/16 职场文书
职场干货:简历中的自我评价应该这样写!
2019/05/06 职场文书
如何在Python中妥善使用进度条详解
2022/04/05 Python