一个简单的AJAX示例

2013-01-08 22:16

一个简单的AJAX示例

by 司徒正美

at 2013-01-08 14:16:00

original http://www.cnblogs.com/rubylouvre/archive/2013/01/08/2851051.html

虽然现在有了框架,许多AJAX调用直接调用它们的API就可用。但有些极端情况,比如面试,比如第三方应用不想加载这些库,我们就只有自己写。这时想必有许多人要疯狂google,百度了。网上太多垃圾信息,我还是在自己博客上保存一份吧。

我的实现:


var ajax = new(self.XMLHttpRequest||ActiveXObject)("Microsoft.XMLHTTP")
ajax.onreadystatechange = function(){
if (ajax.readyState==4 && ajax.status==200){
alert(ajax.responseText)
}
}
ajax.open("POST", url, true);
ajax.send("key=val&key1=val2");

群里黑暗骑士的实现:


Ajax = function(){
function request(url,opt){
function fn(){}
var async = opt.async !== false,
method = opt.method || 'GET',
data = opt.data || null,
success = opt.success || fn,
failure = opt.failure || fn;
method = method.toUpperCase();
if(method == 'GET' && data){
url += (url.indexOf('?') == -1 ? '?' : '&') + data;
data = null;
}
var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
xhr.onreadystatechange = function(){
onStateChange(xhr,success,failure);
};
xhr.open(method,url,async);
if(method == 'POST'){
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded;');
}
xhr.send(data);
return xhr;
}
function
onStateChange(xhr,success,failure){
if(xhr.readyState == 4){
var s = xhr.status;
if(s>= 200 && s < 300){
success(xhr);
}else{
failure(xhr);
}
}else{}
}
return {request:request};
}();

本文链接