由于项目中引进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请求的更多相关文章

  1. 封装的ajax请求

    在做登录注册这类提交表单数据时,我们经常需要局部刷新网页来验证用户输入的信息,这就需要用到ajax请求,我们通常需要获取表单中的数据,发起ajax请求,通过服务程序,与数据库的数据进行比对,判断信息的 ...

  2. 简单封装的ajax请求

    简单封装了一个ajax请求,做一下统一处理,少写重复代码,只是一个初步的代码,没有经过优化. $.extend({ myAjax: function (option, rollBack) { var ...

  3. ES6封装原生ajax请求

    http (data) { return new Promise((resolve, reject) => { var xhr = new XMLHttpRequest(); xhr.onrea ...

  4. spring security:ajax请求的session超时处理

    当前端在用ajax请求时,如果没有设置session超时时间并且做跳转到登录界面的处理,那么只是靠后台是很难完成超时的一系列动作的:但是如果后台 没有封装一个ajax请求公共类,那么在ajax请求上下 ...

  5. 原生AJAX请求教程

    ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...

  6. 原生 ajax 请求

    ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...

  7. 学习AJAX必知必会(4)~JQuery发送Ajax请求

    一.JQuery发送Ajax请求 ■ 对于get和post请求,jQuery内部封装了Ajax请求的4个步骤和数据格式的设置 ■ 对于Ajax通用请求,jQuery内部封装了Ajax请求的4个步骤和数 ...

  8. ajax请求的封装

    前端的工作,免不了要用到交互,请求后端的数据,可能大多人一直选择用jq封装好的方法直接使用,要知道封装这个事我们自己也可以的,今天给大家介绍一种封装方法,而且连跨域问题都不在话下,有了这个函数,是不是 ...

  9. ajax请求原理及jquery $.ajax封装全解析

    .ajax原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其中最关键的一步就是从服务器获得 ...

随机推荐

  1. jquery事件优化---事件委托

    假如你有一个表格,里面有大量的td 而你需要做的事就是,给td绑定点击事件函数, 那么多的td,遍历单元格和为每一个单元格绑定事件处理函数将会大大降低代码的性能, 如果让单元格的父元素监听事件,只要判 ...

  2. iOS审核拒绝苹果官方原因详解

    1.1不当内容应用程序不应该包括攻击性,敏感,令人不悦,侮辱或者品味低下的内容.例如: 1.1.1 诽谤或者人格侮辱的内容,包括引用或者评论宗教.种族.性取向.性别或者其他目标群体的内容,特别是该应用 ...

  3. java对象流(二)

    对象流,可以将java中的对象转为字节进行输出.将对象写入文件时.文件输出流是将字节写入到文件中. 对象流是将给定的对象转化为一组字节.writeObject()方法就是将对象转为字节. 对象流,读的 ...

  4. review01

    .java叫源文件,java编译器编译源文件后会产生字节码文件,java解释器将字节码文件加载进内存,java虚拟机来执行字节码文件. 如下列文件名为“String01.java” public cl ...

  5. Android之动画1

    点此下载 package com.example.animationdemo; import java.util.Timer; import java.util.TimerTask; import a ...

  6. The import java.util cannot be resolved

    原因:项目buildpath不对 解决方案: 右键项目-------build path--------configuration build path 的选择libraries找到JRE(这个时候你 ...

  7. javascript-DOM操作-留言板制作

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. poj2114树分治

    题意:给你一棵树,每条边有权值,求有没有一条链使得权值和为k 题解:和上一题类似,依旧是树分治,只是我们储存结果的时候是判断加起来为k的点对数,刚开始本来想用map存答案,结果就t了,后来用了vect ...

  9. GIT 应用gitreview方式提交代码过程

    t status -- 是不是修改的文件 git diff (文件名) -- 看文件修改位置 git add (文件名的空格串) git commit -- 提交到本地 git stash -- 暂存 ...

  10. Python学习之路day4-函数高级特性、装饰器

    一.预备知识 学习装饰器需理解以下预备知识: 函数即变量 函数本质上也是一种变量,函数名即变量名,函数体就变量对应的值:函数体可以作为值赋给其他变量(函数),也可以通过函数名来直接调用函数.调用符号即 ...