时间:2021-05-25
Ajax篇
XMLDocument和XMLHttpRequest对象
第一:创建XMLHttpRequest请求对象
复制代码 代码如下:
function getXMLHttpRequest() {
var xRequest=null;
if(window.XMLHttpRequest) {
xRequest=new XMLHttpRequest();
}else if(typeof ActiveXObject != "undefined"){
xRequest=new ActiveXObject("Microsoft.XMLHTTP");
}
return xRequest;
}
或者:
复制代码 代码如下:
var request=null;
function createRequest() {
try {
request=new XMLHttpRequest(); //非Microsoft IE浏览器
} catch (trymicrosoft) { //Microsoft IE
try {
request=new ActiveXObject(“Msxml2.XMLHTTP”);
} catch (othermicrosoft) {
try {
request=new ActiveXObject(“Microsoft.XMLHTTP”);
} catch (failed) {
request=null;
}
}
}
if (request==null)
alert(“Error creating request object!”);
}
[code]
这个独立的创建XMLHttpRequest请求对象的函数就可以被调用了。
注意:XMlHTTP对象不是W3C标准,因此在创建时要分别考虑不同浏览器环境的支持。
XMLHTTP对象一共就6个方法8个属性,支持两种执行模式:同步和异步。
XMLHTTP对象的属性和方法列表(来自IXMLHTTPRequest接口): 属性名
类型
描述
onreadystatechange
N/A
指定当就绪状态发生改变时调用的事件处理函数,仅用于异步操作
readyState
Long
异步操作的状态:未初始化(0),正在加载(1),已加载(2),交互(3),已完成(4)
responseBody
Variant
将响应信息正文作为unsigned byte数组返回
responseStream
Variant
将响应信息正文作为一个ADO Stream对象返回
responseText
String
将响应信息正文作为一个文本字符串返回
responseXML
Object
通过XMLDom将响应信息正文解析为XMLDocument对象
status
Long
服务器返回的HTTP状态码
statusText
String
服务器HTTP响应行状态
方法名
描述
abort
取消当前 HTTP 请求
getAllResponseHeaders
从响应信息中检索所有的首部字段
getResponseHeader
从响应信息正文中获得一个 HTTP 首部字段值
open(method,url,boolAsync,bstrUser,bstrPassword)
打开一个与 HTTP 服务器的连接
send(varBody)
向HTTP服务器发送请求。可包含正文。
setRequestHeader(bstrHeader, bstrValue)
设定一个请求的首部字段
第二:向服务器发送请求
通过XMLHttpRequest对象向服务器发送请求是非常简单,只需要给它传递一个服务器页面的URL,这个页面将生成数据。
[code]
function sendRequest(url,params,HttpMethod) {
if(!HttpMethod){
HttpMethod="POST";
}
var req=getXMLHttpRequest();
if(req){
req.open(HttpMethod,url,true);
req.setRequestHeader("Content-Type","application/x-plete
Function
请求完成后回调函数 (请求成功或失败时均调用)。参数: XMLHttpRequest 对象,成功信息字符串。
function (XMLHttpRequest, textStatus) {
this; // the options for this ajax request
}
contentType
String
(默认: "application/x-www-form-urlencoded") 发送信息至服务器时内容编码类型。默认值适合大多数应用场合。
data
Object,
String
发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组,jQuery 将自动为不同值对应同一个名称。如:
{foo:["bar1", "bar2"]}转换为 '&foo=bar1&foo=bar2'。
dataType
String
预期服务器返回的数据类型。如果不指定,jQuery 将自动根据HTTP 包 MIME 信息返回responseXML 或 responseText,并作为回调函数参数传递,可用值:
"xml": 返回 XML 文档,可用 jQuery 处理。
"html": 返回纯文本 HTML 信息;包含 script 元素。
"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。
"json": 返回 JSON 数据 。
"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。
error
Function
(默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。这个方法有三个参数:XMLHttpRequest 对象,错误信息,(可能)捕获的错误对象。
function (XMLHttpRequest, textStatus, errorThrown) {
// 通常情况下textStatus和errorThown只有其中一个有值
this; // the options for this ajax request
}
global
Boolean
(默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 。可用于控制不同的Ajax事件
ifModified
Boolean
(默认: false) 仅在服务器数据改变时获取新数据。使用 HTTP 包 Last-Modified 头信息判断。
processData
Boolean
(默认: true) 默认情况下,发送的数据将被转换为对象(技术上讲并非字符串) 以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。
success
Function
请求成功后回调函数。这个方法有两个参数:服务器返回数据,返回状态
function (data, textStatus) {
// data could be xmlDoc, jsonObj, html, text, etc...
this; // the options for this ajax request
}
这里Ajax事件里面的 this 都是指向Ajax请求的选项信息的。
jQuery.ajaxSetup( options ) : 设置全局 AJAX 默认选项。
如:设置 AJAX 请求默认地址为 "/xmlhttp/",禁止触发全局 AJAX 事件,用 POST 代替默认 GET 方法。其后的 AJAX 请求不再设置任何选项参数。其示例代码:
$.ajaxSetup({
url: "/xmlhttp/",
global: false,
type: "POST"
});
$.ajax({ data: myData });
serialize() 与 serializeArray()
serialize() : 序列表表格内容为字符串。
serializeArray() : 序列化表格元素 (类似 '.serialize()' 方法) 返回 JSON 数据结构数据。
以上JQuery Ajax的底层实现,我们一般很少用到,JQuery对jQuery.ajax()进行了封装,使我们能够更加简便的使用Ajax异步调用。
1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中。
url (String) : 请求的HTML页的URL地址。
data (Map) : (可选参数) 发送至服务器的 key/value 数据。
callback (Callback) : (可选参数) 请求完成时(不需要是success的)的回调函数。
这个方法默认使用 GET 方式来传递的,如果[data]参数有传递数据进去,就会自动转换为POST方式的。jQuery 1.2 中,可以指定选择符,来筛选载入的 HTML 文档,DOM 中将仅插入筛选出的 HTML 代码。语法形如 "url #some > selector"。
这个方法可以很方便的动态加载一些HTML文件,例如表单。
2. jQuery.get( url, [data], [callback] ) :使用GET方式来进行异步请求
url (String) : 发送请求的URL地址.
data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示,会作为QueryString附加到请求URL中。
callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。
3. jQuery.post( url, [data], [callback], [type] ) :使用POST方式来进行异步请求
url (String) : 发送请求的URL地址.
data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示。
callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。
type (String) : (可选)官方的说明是:Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)
如果你设置了请求的格式为"json", 此时你没有设置Response回来的ContentType 为:Response.ContentType = "application/json"; 那么你将无法捕捉到返回的数据。
4. jQuery.getScript( url, [callback] ) : 通过 GET 方式请求载入并执行一个 JavaScript 文件。
url (String) : 待载入 JS 文件地址。
callback (Function) : (可选) 成功载入后回调函数。
jQuery 1.2 版本之前,getScript 只能调用同域 JS 文件。 1.2中,您可以跨域调用 JavaScript 文件。注意:Safari 2 或更早的版本不能在全局作用域中同步执行脚本。如果通过 getScript 加入脚本,请加入延时函数。
这个方法可以用在例如当只有编辑器focus()的时候才去加载编辑器需要的JS文件。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
废话不多说了,直接给大家贴代码了。jQuery(function($){//备份jquery的ajax方法var_ajax=$.ajax;//重写ajax方法,
ajax操作全局监测,用户session失效的解决方法jQuery(function($){//备份jquery的ajax方法var_ajax=$.ajax;/
摘要:ajax学习1中介绍了使用jquery封装的ajax来接收服务器端的文本数据以及使用XMLHttpReques对象来接收服务器端的文本数据ajax学习2中
由于项目中需要在提交ajax前设置header信息,jquery的ajax实现不了,我们自己封装几个常用的ajax方法。jQuery的ajax普通封装varaj
今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是:保存数据到服务器,成功时显示信息。jQuery代码:复制代码代码如下:$.ajax({type