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 相关文章推荐
JQuery操作三大控件(下拉,单选,复选)的方法
Aug 06 Javascript
动态加载script文件的两种方法
Aug 15 Javascript
jquery快捷动态绑定键盘事件的操作函数代码
Oct 17 Javascript
javascript学习笔记(四)function函数部分
Sep 30 Javascript
Javascript中使用parseInt函数需要注意的问题
Apr 02 Javascript
JavaScript动态创建form表单并提交的实现方法
Dec 10 Javascript
jQuery中hover与mouseover和mouseout的区别分析
Dec 24 Javascript
复杂的javascript窗口分帧解析
Feb 19 Javascript
微信小程序  简单实例(阅读器)的实例开发
Sep 29 Javascript
详解使用vue脚手架工具搭建vue-webpack项目
May 10 Javascript
vue-cli webpack 引入swiper的操作方法
Sep 15 Javascript
使用jQuery如何写一个含验证码的登录界面
May 13 jQuery
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
很让人受教的 提高php代码质量36计
2012/09/05 PHP
4种PHP异步执行的常用方式
2015/12/24 PHP
php自动提交表单的方法(基于fsockopen与curl)
2016/05/09 PHP
PHP 数组基本操作方法详解
2016/06/17 PHP
thinkphp jquery实现图片上传和预览效果
2020/07/22 PHP
下拉菜单点击实现连接跳转功能的js代码
2013/05/19 Javascript
在Node.js应用中使用Redis的方法简介
2015/06/24 Javascript
基于jquery编写分页插件
2016/03/07 Javascript
深入了解JavaScript的逻辑运算符(与、或)
2016/12/20 Javascript
Angular的自定义指令以及实例
2016/12/26 Javascript
通过命令行创建vue项目的方法
2017/07/20 Javascript
关于vuejs中v-if和v-show的区别及v-show不起作用问题
2018/03/26 Javascript
vue给对象动态添加属性和值的实例
2019/09/09 Javascript
vue:el-input输入时限制输入的类型操作
2020/08/05 Javascript
[31:29]完美世界DOTA2联赛PWL S3 INK ICE vs Magma 第一场 12.20
2020/12/23 DOTA
Python 时间操作例子和时间格式化参数小结
2014/04/24 Python
浅谈Python中数据解析
2015/05/05 Python
Python中int()函数的用法浅析
2017/10/17 Python
Python数据报表之Excel操作模块用法分析
2019/03/11 Python
python 利用已有Ner模型进行数据清洗合并代码
2019/12/24 Python
Python打开文件、文件读写操作、with方式、文件常用函数实例分析
2020/01/07 Python
一款基于css3的列表toggle特效实例教程
2015/01/04 HTML / CSS
意大利综合购物网站:Giordano Shop
2016/10/21 全球购物
英国在线珠宝店:The Jewel Hut
2017/03/20 全球购物
eBay爱尔兰站:eBay.ie
2019/08/09 全球购物
安德玛比利时官网:Under Armour比利时
2019/08/28 全球购物
New Balance比利时官方网站:购买鞋子和服装
2021/01/15 全球购物
面向对象概念面试题(.NET)
2016/11/04 面试题
采购部部门职责
2013/12/15 职场文书
法人代表委托书
2014/04/04 职场文书
感恩教师节演讲稿
2014/09/03 职场文书
领导干部作风整顿个人剖析材料
2014/10/11 职场文书
大学生考试作弊被抓检讨书
2014/12/27 职场文书
工厂仓管员岗位职责
2015/04/01 职场文书
个人承诺书格式范文
2015/04/29 职场文书
Redis 限流器
2022/05/15 Redis