javascript原生ajax之mini-ajax.js

字号+ 编辑: 国内TP粉 修订: 小红帽 来源: ThinkPHP 2023-09-05 我要说两句(0)

原生javascript实现的ajax方法,如:Ajax.post();Ajax.get();Ajax.json();Ajax.upload();

使用详情请访问:https://git.oschina.net/wuquanyao/mini-ajax.js

/*=================================================
 * mini-ajax.js
 * author: wuquanyao
 * email: wqynqa@163.com
 * ver: beta
 * date: 2015-10
 *===================For Example===================
 * Ajax.get('request.php',{a:2015,b:'wqyn'},function(response){
 *    console.log(response);
 * },'json');
 *=================================================
 * Ajax.post('request.php',{C:'This is request!',D:'datamap'},function(response){
 *    console.log(response);
 * },'json');
 *=================================================
 * Ajax.json('request.php',{xcv:'This is request!',vcd:'datamap'},function(response){
 *    console.log(response);
 * });
 *=================================================
 */
var Ajax = {};
(function(Ajax){
    
    Ajax.get = function(url,data,func,dataType){
        init(url,data,'GET',func,dataType);
    }
    
    Ajax.post = function(url,data,func,dataType){
        init(url,data,'POST',func,dataType);
    }
    
    Ajax.json = function(url,data,func){
        init(url,data,'GET',func,'json');
    };
    Ajax.upload = function(params){
        //do something, not realized, follow up!!
    }
    function init(url,data,requestType,func,dataType){
        if(!url){
            alert('Request url can not be empty!');
            return false;
        }    
        
        var dlen = count(data);
        if(requestType=='GET'){
            if(dlen){
                var search = kvalue(data);
                url = (url.indexOf('?')==-1)?(url+'?'+search):(url+search);
            }
            data = null;
        }else if(requestType=='POST'){
            if(!dlen)
            data = null;
            else
            data = kvalue(data);
        }
        
        var xmlHttp        = false,
            requestType    = requestType || 'GET';
            dataType       = dataType || 'json';
            func           = func || function(param){};
        
        if(window.XMLHttpRequest){
            xmlHttp = new XMLHttpRequest();
        }else{
            try
            {
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP.5.0");
            }catch(e){
                try
                {
                    xmlHttp = new ActiveXObject("Msxml2.XMLHTTP.4.0");
                }catch(e){
                    try
                    {
                        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
                    }catch(e){
                        try{
                            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                        }catch(e){
                        }
                    }    
                }
            }            
        }
        
        if(!xmlHttp){
            alert('Your browser does not support Ajax!');
            return false;
        }
        if(xmlHttp.overrideMimeType){ 
            xmlHttp.overrideMimeType('text/html');
        }
        var accept =  {
            text: 'text/plain',
            html: 'text/html',
            xml : 'application/xml,text/xml',
            json: 'application/json,text/javascript'
        };
        //get,post,put,delete
        xmlHttp.open(requestType,url,true);
        if(requestType == 'POST'){
            xmlHttp.setRequestHeader('Content-type','application/x-www-form-urlencoded;charset=UTF-8');
            //xmlHttp.setRequestHeader('Content-type','multipart/form-data');
        }
        xmlHttp.setRequestHeader('Accept', accept[dataType]+';q=0.9,image/webp,*/*;q=0.8');
        xmlHttp.setRequestHeader('Accept-Language', 'zh-cn,zh;q=0.8');
        xmlHttp.setRequestHeader('Cache-Control', 'max-age=21600');
        xmlHttp.onreadystatechange = function(){
            if((xmlHttp.readyState == 4) && xmlHttp.status == 200){
                var d = xmlHttp.responseText;
                if(dataType == 'json'){
                    d = JSON.parse(d);
                }
                func(d);
            };
        } 
        xmlHttp.send(data);
    }
    
    function kvalue(params,sep)
    {
        var kv  = '';
            sep = sep || '&';
        for(key in params){
            kv+=key+'='+params[key]+sep;
        }
        return kv.substring(0,kv.length-1);
    }
    
    function count(data)
    {
        var index = 0;
        for(i in data){
           index++;
        }
        return index;
    }
    
})(Ajax)
阅完此文,您的感想如何?
  • 有用

    0

  • 没用

    0

  • 开心

    0

  • 愤怒

    0

  • 可怜

    0

1.如文章侵犯了您的版权,请发邮件通知本站,该文章将在24小时内删除;
2.本站标注原创的文章,转发时烦请注明来源;
3.交流群: PHP+JS聊天群

相关课文
  • JS如何防止父节点的事件运行

  • nodejs编写一个简单的http请求客户端代码demo

  • 使用Sublime Text3 开发React-Native的配置

  • 说一则为什么后端开发人员不选择node.js的原因

我要说说
网上宾友点评