zoukankan      html  css  js  c++  java
  • 基于JavaScript封装的Ajax工具类

    前段是件由于工作需要无奈编写了一个给予JavaScript封装的工具类,技术有限,误喷,感谢大家的支持。

    1、以下是JavaScript 的 Ajax 工具类。

    function createXMLHttpRequest(){
        var req;
        if(window.XMLHttpRequest){
            //兼容非IE  并且兼容 IE7以上的浏览器
            req = new XMLHttpRequest();
        }else if(window.ActiveXObject){
            //在 Internet Explorer 5.5 及其后版本中可用
            try {
                req = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                //在 Internet Explorer 6 中可用
                req = new ActiveXObject("Msxml2.XMLHTTP");
            }
        }
        
        return req;
    }
    
    /*
    参数介绍:
    method:提交方式(get,post)
    url:请求的路径
    param:需要传递的参数
    async:是否一步
    type:返回值类型(xml,json,默认字符串)
    fn200:是一个function 处理请求成功后的的事情
    fn404:是一个function 处理请求失败报404错误
    fn500:是一个function 处理请求失败报500错误
    */
    function sendAjaxReq(method,url,param,async,type,fn200,fn404,fn500,loading){
        var req = createXMLHttpRequest();
        //2.定义处理响应
        req.onreadystatechange = function (){
            if(req.readyState == 4){
                if(req.status == 200){
                    if(fn200){
                        var result;
                        if(null != type && 'xml' == type.toLowerCase()){
                            result = req.responseXML;
                        }else if(null != type && 'json' == type.toLowerCase()){
                            jsonStr = req.responseText;
                            if(document.all){
                                result = eval('(' + jsonStr + ')');
                            }else{
                                result = JSON.parse(jsonStr);
                            }
                        }else{
                            result = req.responseText;
                        }
                        fn200(result);
                        
                    }
                }else if(req.status == 404){
                    if(fn404){
                        fn404(); 
                    }
                }else if(req.status == 500){
                    if(fn500){
                        fn500();
                    }
                }
            }else{
                if(loading){
                    loading();
                }
            }
        };
        if('get' == method.toLowerCase()){
            req.open(method, url + (param == null ? '' : '?'+param), async);
            req.send(null);
        }else if('post' == method.toLowerCase()){
            //1.定义发送请求  请求的方式   请求的地址    是否异步;
            req.open(method, url, async);
            req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            req.send(param);
        }
      
    }

    2.调用方式:

    function test(){
         var url = "test?date=" + new Date();
         sendAjaxReq("get",url,null,true,'json',function(result){
             //此处是请求成功后回调方法,可做请求成功后的处理,result是后台返回的参数
         },function (){
         //此处可以跳转一个404页面
       },function (){
         //此处是处理500错误
       },function (){
         //处理其他问题
       });
    }
  • 相关阅读:
    .NET重构(七):VS报表的制作
    【Linq】标准查询操作符
    1 TaskQueue 实现Task 队列
    1 疑惑处理
    1 JSONP
    1 Web 知识基础
    20 闭包
    1 基础知识
    Web 常用
    【Winform】2 Button
  • 原文地址:https://www.cnblogs.com/Faith-zhang/p/7517568.html
Copyright © 2011-2022 走看看