jquery-mockjax初试
2015-10-09 16:31
676 查看
1. 原理
jquery-mockjax是用于mock 前台ajax向后台请求的返回数据。 原理很简单 在你js代码要发送ajax请求的地方断点一下,然后比较在【引入jquery-mockjax】 和 【没有引入jquery-mockjax】的情况下$.ajax.toString()的值情况。 很明显,引入jquery-mockjax时,这个mock库会对jquery提供的ajax函数做替换。这样就很容易能mock起来。2. 提供的基本特性
1. 根据指定的url模拟基本本的json数据
$.mockjax({ url:'/restful/fortune', responseTime: 750, responseText: { status: 'success', fortune: 'Are you a turtle?' } });
url上可以做很多文章,支持:
url:
'*'
url:
'/data/*'
url:/^/data/(quote|tweet)$/i
2. 可以是返回text,xml
只要给其responseText responseXML设置相应的值即可xml的例子:
$.mockjax({
url:'/restful/api',
// Need to include the xmlDOM plugin to have this translated into a DOM
responseXML: '<document><quote>Hello world!</quote></document>'
});
3. 可以用proxy指向一个json文件,将json文件中的内容当做json数据mock回去
$.mockjax({
url:'/restful/api',
proxy: '/mocks/data.json'
});
4.response属性可以指向function 以达到mock数据可编程的目的(动态指定)
$.mockjax({
url:'/restful/api',
response: function() {
this.responseText = 'Hello world!';
}
});
5.通过responseTime设置的值mock超时时间
$.mockjax({
url:'/restful/api',
// Simulate a network latency of 750ms
responseTime: 750,
responseText: 'A text response from the server'
});
6.通过status 设置的值mock http状态
$.mockjax({
url:'/restful/api',
// Server 500 error occurred
status: 500,
responseTime: 750,
responseText: 'A text response from the server'
});
7. 通过contentType设置的值mock contentType类型
$.mockjax({
url:'/restful/api',
contentType: 'text/json',
responseText: {
hello: 'World!'
}
});
8.给headers设置一个json对象,mock header信息
$.mockjax({
url:'/restful/api',
contentType: 'text/json',
responseText: {
hello: 'World!'
},
headers: {
etag: 'xyz123'
}
});
ref: http://appendto.com/2010/07/mock-your-ajax-requests-with-mockjax-for-rapid-development/
相关文章推荐
- 开发一个适合Ajax+JSON+jQuery环境使用的多功能页码栏——jPagerBar-1.1.1
- jQuery中使用Ajax获取JSON格式数据
- jQuery 遍历json数组的实现代码
- jquery 实现 图片上传 预览
- jQuery combobox解决检索中文问题
- jquery复选框checkbox实现删除前判断
- jquery attr()方法
- jQuery入门学习笔记----第二章 jQuery选择器
- jQuery入门学习笔记----第一章 jQuery开发入门
- jquery.fn.extend与jquery.extend的区别
- Jquery生成缩略图画廓
- [jquery-ajax] jquery ajax 三种情况对比
- jquery ajax post格式
- a标签的onclick事件与href详解
- JQuery EasyUI DataGrid 纵向(转置)表格插件 TransposedView
- JQuery报错Uncaught TypeError: Illegal invocation
- jQuery的Deferred对象测试笔记以及源码分析
- JQuery实现在页面中央弹出带有动画透明的弹出层
- $().each() 与 $.each()区别,以及 jquery ajax 应用
- jQuery学习日记-------第一篇(jQuery介绍)