MUI框架—AJAX

AJAX

MUI框架基于H5+ API的 XMLHttpRequest，封装了常用的Ajax函数，支持GET、POST请求方式，支持返回json、xml、html、text、script数据类型；本着极简的设计原则，MUI框架对其做了简单封装，并进一步简化出常用的 mui.get()、mui.getJSON()、mui.post()三个方法。

//mui.ajax(url[, setting])
//url：请求发送的目标地址
//settings：key/value格式的json对象，用来配置ajax请求参数
          //async：发送同步请求
          //crossDomain：强制使用H5+跨域
          //data：发送到服务器的业务数据
          //dataType：预期服务器返回的数据类型；如果不指定，MUI框架将自动根据HTTP的MIME头信息自动判断。
                    //xml：返回XML文档
                    //html：返回纯文本HTML信息
                    //script：返回纯文本JavaScript代码
                    //json：返回JSON数据
                    //text：返回纯文本字符串
          //error：请求失败时触发的回调函数，该函数接受三个参数
                    //xhr：xhr实例对象
                    //type：错误描述。可取值"timeout","error","abort","parsererror","null"
                  //errorThrown：可捕获的异常对象
        //success：请求成功时触发的回调函数，该函数接受三个参数
                //data：服务器返回的响应数据，类型可以是json对象、xml对象、字符串等；
              //textStatus：状态描述，默认值为“success”
              //xhr：xhr实例对象
       //timeout：请求超时时间，默认为0，表示永不超时。
      //type：请求方式，目前仅支持“GET”和“POST”，默认“GET”方式
      //headers：指定HTTP请求的Header
            //headers:{'Content-Type':'application/json'}
      //processData：为了匹配默认的 content-type("application/x-www-form-urlencoded")

mui.ajax('http://server-name/login.php',{
    data:{
        username:'username',
        password:'password'
    },
    dataType:'json',//服务器返回json格式数据
    type:'post',//HTTP请求类型
    timeout:10000,//超时时间设置为10秒；
    headers:{'Content-Type':'application/json'},                  
    success:function(data){
        //服务器返回响应，根据响应结果，分析是否登录成功；
        ...
    },
    error:function(xhr,type,errorThrown){
        //异常处理；
        console.log(type);
    }
});

// mui.post(url,[, data][,success][,dataType])方法是对mui.ajax()的一个简化方法。
mui.post('http://server-name/login.php',{
        username:'username',
        password:'password'
    },function(data){
        //服务器返回响应，根据响应结果，分析是否登录成功；
        ...
    },'json'
);

//mui.get(url, [, data][, success][, dataType])方法和mui.post()方法类似
mui.ajax('http://server-name/list.php',{
    data:{
        category:'news'
    },
    dataType:'json',//服务器返回json格式数据
    type:'get',//HTTP请求类型
    success:function(data){
        //获得服务器响应
        ...
    }
});
//mui.getJSON(url[, data][, success])
mui.getJSON('http://server-name/list.php',{category:'news'},function(data){
        //获得服务器响应
        ...
    }
);

参考文档

• MUI官方文档

上一章	暂无下一章