本文实例讲述了javascript跨域请求包装函数与用法。分享给大家供大家参考,具体如下:
一、源码
调用时不再进行判断
_createXHR : function(){
var methods = [
function(){ return new XMLHttpRequest(); },function(){ return new ActiveXObject('Msxml2.XMLHTTP'); },function(){ return new ActiveXObject('Microsoft.XMLHTTP'); }
];
for(var i = 0,l = methods.length; i < l; i++){
try{
methods[i]();
}catch(e){
continue;
}
this._createXHR = methods[i];
return methods[i]();
}
},// 建立XHR请求
_createRequest : function(){
return (this.type == 'json') ? this._setJSONRequest() : this._setXHRRequest();
},_setXHRRequest : function(){
var _this = this;
var param = '';
for(var i in this.param){
if(param == ''){
param = i+'='+this.param[i];
}else{
param+= '&'+i+'='+this.param[i];
}
}
this.XHR = this._createXHR();
this.XHR.onreadystatechange = function(){
if(_this.XHR.readyState == 4 && _this.XHR.status == 200){
_this.callback.success(_this.XHR.responseText);
}else{
_this.callback.failure('重新操作');
}
};
this.XHR.open(this.method,this.url,true);
this.XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8");
this.XHR.send(param);
},// 建立JSON请求
_setJSONRequest : function(){
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
var fun = this._setRandomFun();
var _this = this;
var param = '';
for(var i in this.param){
if(param == ''){
param = i+'='+this.param[i];
}else{
param+= '&'+i+'='+this.param[i];
}
}
script.type = 'text/javascript';
script.charset = 'utf-8';
if(head){
head.appendChild(script);
}else{
document.body.appendChild(script);
}
// data:为回调函数所需要传入的参数
// 定义页面中的回调函数,如例子中的"jsonpCallback()"方法
window._$JSON_callback[fun.id] = function(data){
_this.callback.success(data);
setTimeout(function(){
delete window._$JSON_callback[fun.id];
script.parentNode.removeChild(script);
},100);
};
script.src = this.url+'?callback='+fun.name+'&'+param;
},// 生成随机JSON回调函数
_setRandomFun : function(){
var id = '';
do{
id = '$JSON'+Math.floor(Math.random()*10000);
}while(window._$JSON_callback[id])
return{
id : id,name : 'window._$JSON_callback.'+id
}
}
};
window.$JSON.ajax = function(){
return new $JSON._ajax(arguments);
}
})();
二、调用方式
调用方式
var ajax = new $JSON.ajax({
url : 'http://www.sina.com/api',type : 'json',method : 'get',param: {
bar: true
},callback : {
success : function(data){
console.log( '55668',data);
},failure : function(error){
alert(errow);
}
}
});
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《》、《》、《》、《》、《》、《》、《》及《》
希望本文所述对大家JavaScript程序设计有所帮助。
原文链接:https://www.f2er.com/js/44659.html