标签:
/*封装一个ajax工具函数*/
window.$ = {};
/*通过$定义一个ajax函数*/
/*
* 1. type string 请求的方式 默认是get
* 2. url string 请求地址 接口地址
* 3. async boolean 默认的是true
* 4. data object {}请求数据
*
* 5.success function 成功回调函数
* 6.error function 失败的回调函数
* */
$.ajax = function(options){
if(!options) return false;
/*options 参数传递*/
var type = options.type || ‘get‘;
var url = options.url || location.pathname;
var async = options.async === false ? false : true;
var data = options.data || {};
/*data 选要转化成 name=xjj&age=10*/
var dataStr = ‘‘;
for(var key in data){
//console.log(data[key]);
dataStr += key+‘=‘+data[key]+‘&‘;
}
/*如果就数据 就裁剪掉最后一个&*/
dataStr = dataStr && dataStr.slice(0,-1);
/*ajax 编程*/
/*初始化*/
var xhr = new XMLHttpRequest();
/*请求行*/
/*如果是get请求那么就要拼接数据在url后面 ?*/
xhr.open(type,type == ‘get‘?url+‘?‘+dataStr:url,async);
/*请求头*/
/*如果是post请求需要设置 content-type application/x-www-form-urlencoded*/
if(type == ‘post‘){
xhr.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded‘);
}
options.beforeSend && options.beforeSend();
/*请求主体*/
/*如果是post请求需要把数据字符传过去 否则是null*/
xhr.send(type==‘get‘?null:dataStr);
/*监听响应状态的改变*/
xhr.onreadystatechange = function(){
/*响应成功*/
if(xhr.readyState == 4){
if( xhr.status == 200){
/*处理响应成功函数*/
var result = ‘‘;
/*接受数据*/
/* json xml string*/
var contentType = xhr.getResponseHeader(‘Content-Type‘);
if(contentType.indexOf(‘xml‘) > -1){
/*服务端返回的是xml数据格式*/
result = xhr.responseXML;
}else if(contentType.indexOf(‘json‘) > -1){
/*服务端返回的是json数据格式*/
/*json字符串*/
var str = xhr.responseText;
result = JSON.parse(str);
}else{
result = xhr.responseText;
}
/*调用回调函数*/
options.success && options.success(result);
}
/*响应失败*/
else{
/*处理响应失败函数*/
options.error && options.error(‘request fail code‘ + xhr.status);
}
options.complete && options.complete();
}
}
};
$.get = function(options){
options.type = ‘get‘;
$.ajax(options);
};
$.post = function(options){
options.type = ‘post‘;
$.ajax(options);
};
/*封装一个ajax工具函数*/window.$ = {};/*通过$定义一个ajax函数*/
/** 1. type string 请求的方式 默认是get* 2. url string 请求地址 接口地址* 3. async boolean 默认的是true* 4. data object {}请求数据** 5.success function 成功回调函数* 6.error function 失败的回调函数* */$.ajax = function(options){
if(!options) return false;
/*options 参数传递*/ var type = options.type || ‘get‘; var url = options.url || location.pathname; var async = options.async === false ? false : true; var data = options.data || {};
/*data 选要转化成 name=xjj&age=10*/ var dataStr = ‘‘; for(var key in data){ //console.log(data[key]); dataStr += key+‘=‘+data[key]+‘&‘; }
/*如果就数据 就裁剪掉最后一个&*/ dataStr = dataStr && dataStr.slice(0,-1);
/*ajax 编程*/ /*初始化*/ var xhr = new XMLHttpRequest();
/*请求行*/ /*如果是get请求那么就要拼接数据在url后面 ?*/ xhr.open(type,type == ‘get‘?url+‘?‘+dataStr:url,async);
/*请求头*/ /*如果是post请求需要设置 content-type application/x-www-form-urlencoded*/ if(type == ‘post‘){ xhr.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded‘); }
options.beforeSend && options.beforeSend();
/*请求主体*/ /*如果是post请求需要把数据字符传过去 否则是null*/ xhr.send(type==‘get‘?null:dataStr);
/*监听响应状态的改变*/ xhr.onreadystatechange = function(){ /*响应成功*/ if(xhr.readyState == 4){ if( xhr.status == 200){ /*处理响应成功函数*/ var result = ‘‘; /*接受数据*/ /* json xml string*/ var contentType = xhr.getResponseHeader(‘Content-Type‘);
if(contentType.indexOf(‘xml‘) > -1){ /*服务端返回的是xml数据格式*/ result = xhr.responseXML; }else if(contentType.indexOf(‘json‘) > -1){ /*服务端返回的是json数据格式*/ /*json字符串*/ var str = xhr.responseText; result = JSON.parse(str); }else{ result = xhr.responseText; }
/*调用回调函数*/ options.success && options.success(result); } /*响应失败*/ else{ /*处理响应失败函数*/ options.error && options.error(‘request fail code‘ + xhr.status); }
options.complete && options.complete(); } }};
$.get = function(options){ options.type = ‘get‘; $.ajax(options);};$.post = function(options){ options.type = ‘post‘; $.ajax(options);};
标签:
原文地址:http://www.cnblogs.com/landofpromise/p/5719513.html