您的位置：首页 > Web前端 > JQuery

【jquery】适用Deferred实现jquery将请求封装成函数

2017-06-23 21:05 375 查看

有时候需要将jquery的请求api数据的代码封装成函数，供其他页面调用，此时有两种方法，一种是适用ajax发起同步请求，但是ajax的同步请求会阻塞主线程UI的刷新。在jquery 1.5.0之后引入了Deferred，关于Deferred的相关学习和说明可以参考如下一些优秀的界面：

http://blog.csdn.net/ljj_9/article/details/52797299

本文介绍一个简单的使用demo，该demo封装了三个使用jquery发起的get请求方法，每个方法接受一个传入的参数。代码如下：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HTML5的标题</title>
<script src="/js/jquery-1.12.2.min.js"></script>
<script>
function getLocation(imei) {
var defer = $.Deferred();
$.get("/devices/"+imei+"/location",function(data,status){
defer.resolve(data);
});
return defer.promise();
}

function getMileage(imei) {
var defer = $.Deferred();
$.get("/devices/"+imei+"/mileage",function(data,status){
defer.resolve(data);
});
return defer.promise();
}

function getFences(imei) {
var defer = $.Deferred();
$.get("/devices/"+imei+"/fences",function(data,status){
defer.resolve(data);
});
return defer.promise();
}

$(document).ready(function(){
$("button").click(function() {
//get location.
$.when(getLocation("869449021424717")).done(function(data) {
alert("get location code="+data.code);
});
//get milegae.
$.when(getMileage("869449021424717")).done(function(data) {
alert("get mileage code="+data.code);
});
//get fences.
$.when(getFences("869449021424717")).done(function(data) {
alert("get fences code="+data.code);
});
});
});
</script>
</head>
<body>
<button>点击发送请求</button>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： jquery

相关文章推荐

新的分享

章节导航