mui封装的ajax请求
Posted 临飞
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了mui封装的ajax请求相关的知识，希望对你有一定的参考价值。
由于项目中引进MUI框架，所以就不需要引进jquery，但需要和后台交互时，常写为jquery格式；所以笔者觉得有必要将mui封装的ajax请求在这里提一下；
1，mui框架基于htm5plus的XMLHttpRequest，封装了常用的Ajax函数，支持GET、POST请求方式，支持返回json、xml、html、text、script数据类型；
本着极简的设计原则，mui提供了mui.ajax方法，并在mui.ajax方法基础上，进一步简化出最常用的mui.get()、mui.getJSON()、mui.post()三个方法；
2，mui.ajax()
参数：
url Type: String 请求发送的目标地址
async Type: Boolean 发送同步请求
data {xx:xx,xxx:xxx} 发送到服务器的业务数据
dataType "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，表示永不超时；若超过设置的超时时间(非0的情况)，依然未收到服务器响应，则触发error回调
type 请求方式，目前仅支持‘GET‘和‘POST‘，默认为‘GET‘方式
headers 指定HTTP请求的Header；
3，案例：
a.mui.ajax({
url : ‘${ctx}carReserve/getTravelApplyNo‘,//请求路径；
type : ‘GET‘,//表示调用get方法请求；
dataType:‘json‘,//表示以json形式接受返回参数
success : function(data){//请求成功，返回函数
alert("ok");
},
error : function(xhr,type,errorThrown){){//请求失败，返回函数
alert("error");
}
});
b.mui.post("${ctx}carReserve/getTravelApplyNo",{},function(data){
var datas=data.rows;
travelApplyNo.value = datas[0].travelApplyNo;
},‘json‘);
})
mui.post:表示调用post方法请求；
"${ctx}carReserve/getTravelApplyNo"：请求路径；
{}：大括号里边填写请求参数；
function(data)：表示返回函数，data为返回参数；
‘json‘：表示以json形式接受返回参数。
mui.get()、mui.getJSON()和上述原理相同，我就举两个典型的，剩下的大家有兴趣也可以试试！
由于笔者目前水平有限，难免出现错误，还望大家能够指出来，共同提高。
以上是关于mui封装的ajax请求的主要内容，如果未能解决你的问题，请参考以下文章