ajax原生库
<------------------------ajax.js---------------------------->
var $ = {};
$.xho = function () { //创建xmlhttprequest对象
var http_request = null;
if (window.XMLHttpRequest) { //Mozilla 浏览器
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {//设置MIME类别
http_request.overrideMimeType("text/xml");
}
}
else if (window.ActiveXObject) { //IE浏览器
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) { }
}
}
return http_request;
}
$.rsc = function (obj, callfunc) {
return function () {
if (obj.readyState == 4) {
if (obj.status == 200) {
callfunc(obj.responseText);
}
}
}
}
$.GET = function (url, callfunc) {
var xho = $.xho();
if (xho == null) return;
xho.onreadystatechange = $.rsc(xho, callfunc); //设置回调函数
//第三个参数指定在等待服务器返回信息的时间内是否继续执行下面代码，如果为true，则不会继续执行，默认为true
xho.open("GET", url, true);
xho.send(null);
}
$.POST = function (url, data, callfunc) {
var xho = $.xho();
if (xho == null) return;
xho.onreadystatechange = $.rsc(xho, callfunc); //设置回调函数
xho.open("POST", url, true);
xho.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //post请求必须修改MIME类别
xho.send(data);
}
<------------------------ajax.js---------------------------->
<------------------------demo.html------------------------>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="ajax.js" type="text/javascript"></script>
<script type="text/javascript">
function btn(method) {
if (method == "get") {
$.GET("Handler.ashx?name=hello,get", function (data) {
document.getElementById("get_div").innerHTML = "GET数据：" + data;
});
} else {
$.POST("Handler.ashx", "name=holle,post", function (data) {
document.getElementById("post_div").innerHTML = "POST数据：" + data;
});
}
}
</script>
</head>
<body>
<input type="button" value="GET点击" onclick="btn("get")" />
<div id="get_div">
</div>
<input type="button" value="POST点击" onclick="btn("post")" />
<div id="post_div">
</div>
</body>
</html>
<------------------------demo.html------------------------>
另 赋另一种调用方式实现的ajax的js代码
//创建一个XMLHttpRequest对象
function XmlHttpObj() {
var xmlhttp = null;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
if (xmlhttp.overrideMimeType) { //设置MiME类别
xmlhttp.overrideMimeType("text/xml");
}
} else if (window.ActiveXObject) {
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) { }
}
}
return xmlhttp;
}
//回调函数
function ReadyStateChange(obj, funcname) {
return function () {
if (obj.xho.readyState == 4 && obj.xho.status == 200) {
funcname(obj.xho.responseText);
}
}
}
function AjaxRequest() {
this.xho = XmlHttpObj();
if (this.xho == null) return;
}
AjaxRequest.prototype.Post = function (url, data, funcname) {
this.xho.open("POST", url, false);
this.xho.onreadystatechange = ReadyStateChange(this, funcname);
this.xho.setRequestHeader("CONTENT-TYPE", "application/x-www-form-urlencoded");
this.xho.send(data);
}
AjaxRequest.prototype.Get = function (url, funcname) {
this.xho.open("GET", url, true);
this.xho.onreadystatechange = ReadyStateChange(this, funcname);
this.xho.send(null);
}
