原生ajax函数封装

Deadly 提交于 2020-02-24 08:33:18

原生ajax函数

function ajax(json){
    json=json || {};
    if(!json.url){    return;   }
    json.data=json.data || {};
    json.type=json.type || 'get';

    var xmlhttp = null;
    if(window.XMLHttpRequest){
        xmlhttp=new XMLHttpRequest();
    }else{
        xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');  //兼容IE
    }

    //将data转换成字符串
    var arr = [];
    for(var key in json.data){
        arr.push(key + "=" + json.data[key]);
    }
    var postData = arr.join("&");

    json.type = json.type.toUpperCase();

    if(json.type === "GET"){
        xmlhttp.open(json.type, json.url+'?'+postData+"&time=" +Math.random(), true);
        xmlhttp.send();
    }else{
        xmlhttp.open(json.type, json.url, true);
        xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=utf-8');
        xmlhttp.send(postData);
    }
    xmlhttp.onreadystatechange=function(){
        if(xmlhttp.readyState === 4){
            if(xmlhttp.status>=200 && xmlhttp.status<300 || xmlhttp.status==304){
                json.success && json.success(xmlhttp.responseText);
            }else{
                json.error && json.error(xmlhttp.status);
            }
        }
    };
}

使用方法举例:

ajax({
  url: '/login',
  data: {user: oUser.value, pass: oPass.value},
  success: function (str){
    var json=eval('('+str+')');
    if(json.ok){
      alert('登录成功');
    }else{
      alert('失败:'+json.msg);
    }
  },
  error: function (){
    alert('通信失败');
  }
});

 

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!