AJAX封装实例

2019独角兽企业重金招聘Python工程师标准>>>

 

1，创建Ajax的核心对象XMLHttpRequest

因为浏览器之间的不兼容，IE7之前的版本并没有原生的XMLHttpRequest对象却实现为ActiveX对象。
互联网及各种书籍中有着多种创建方式，有的复杂很多行代码，有的则简洁很少代码。当然复杂的考虑的情形更多一些。如下几乎将IE中所有的情况都考虑到了

1	var  xhr = window.XMLHttpRequest ?new  XMLHttpRequest() :new  ActiveXObject('Microsoft.XMLHTTP');

2，发送请求 

1 2	xhr.open xhr.send

3，处理响应

1 2 3 4 5 6 7

xhr.onreadystatechange =function(){     if(xhr.readyState == 4){         if(xhr.status == 200){//当然你可以把200~300之间或304的都理解成响应成功             //callback         }     } }

完整代码如下

function ajax(method,url,data,async,hander200,loading,hander404,hander500){
			var request = null;
			if(window.XMLHttpRequest){
				request = new XMLHttpRequest();
			}else if(window.ActiveXObject){
				request = new ActiveXObject("Microsoft.XMLHTTP");
			}
			request.onreadystatechange=function(){
				if(4==request.readyState){
					if(200==request.status){
						if(hander200){
							 hander200(request);
							}
					}else if(404==request.status){
						if(hander404){
							hander404();
						}
					}else if(500==request.status){
						if(hander500){
							hander500();
						}
					}
				}else{
					if(loading){
						loading();
						}
				}
			}
			if("get"==method.toLowerCase()){
				if(data==null||data==""){
					request.open("get",url,async);
				}else{
					request.open("get",url+"?"+data,async);
				}
				request.send(null);
			}else if("post"==method.toLowerCase()){
				request.open("post",url,async);
				request.setRequestHeader("content-Type","application/x-www-form-urlencoded");
				request.send(data);
			}
			
		}

 

转载于:https://my.oschina.net/ichaoge/blog/145137