AJAX里调用AJAX,作定时进度刷新
这个确实搞了一段时间,但成就感有啦。。。
哈哈,这个自动部署平吧,异步队列CELERY+REDIS,发布进度实时AJAX的技术点全部打通!!!
而获取实时进度,我用的是RESTFUL FRAMEWORK提供的API,让JSON数据实时返回。
我都快被自已的想法感动!:)
重点代码:
function showPercent(id_data){
var _interval;
var percent_value;
$.getJSON("url" + id_data,
function(data,state){
if (state == 'success') {
$('#' + id_data).html("<div class='uk-progress uk-progress-striped uk-progress-active'><div class='uk-progress-bar' style='width: " + data.deploy_status + "%;'>" + data.deploy_status + "%</div><i class='uk-icon-cog uk-icon-spin'></i></div>");
percent_value = data.deploy_status;
console.log(percent_value)
if ( percent_value != 100 ){
_interval = setInterval(showPercent(id_data), 3000);
} else {
clearInterval(_interval);
$('#' + id_data).html("<div class='uk-progress uk-progress-striped uk-progress-success'><div class='uk-progress-bar' style='width: " + data.deploy_status + "%;'>" + data.deploy_status + "%</div></div>");
};
};
}
);
};
来个图:

AJAX里调用AJAX,作定时进度刷新的更多相关文章
- Ajax异步调用http接口后刷新页面
使用Ajax的目的就是提高页面响应速度,无需同步调用,无需整个页面刷新.这里直接在html中使用js来实现: 先获取XMLHttpRequest对象 var xmlHttp; //创建一个xmlHtt ...
- AJAX JQuery 调用后台方法返回值(不刷新页面)
AJAX JQuery 调用后台方法返回值(不刷新页面) (1)无参数返回值(本人亲试返回结果不是预期结果) javascript方法: $(function () { //无 ...
- jQuery调用AJAX异步详解[转]
AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1) 使用CSS和X ...
- ajax 异步上传视频带进度条并提取缩略图
最近在做一个集富媒体功能于一身的项目.需要上传视频.这里我希望做成异步上传,并且有进度条,响应有状态码,视频连接,缩略图. 服务端响应 { "thumbnail": "/ ...
- 【原创经验分享】JQuery(Ajax)调用WCF服务
最近在学习这个WCF,由于刚开始学 不久,发现网上的一些WCF教程都比较简单,感觉功能跟WebService没什么特别大的区别,但是看网上的介绍,就说WCF比WebService牛逼多少多少,反正我刚 ...
- drupal里面的ajax最粗浅的理解-流程
1, form里面的ajax所在地表单元素有一个事件,激发system/ajax,相应的有ajax_form_callback(), 会把被改变的元素值传到form_state[values]中, ...
- jQuery Ajax 方法调用 Asp.Net WebService 以及调用aspx.cs中方法的详细例子
一.jQuery Ajax 方法调用 Asp.Net WebService (引自Terry Feng) Html文件 <!DOCTYPE html PUBLIC "-//W3C//D ...
- ecshop中ajax的调用原理 1
ecshop中ajax的调用原理 1:首先ecshop是如何定义ajax对象的. ecshop中的ajax对象是在js/transport.js文件中定义的.里面是ajax对象文件.声明了一个va ...
- ECSHOP中ajax的调用原理
ECSHOP中ajax的调用原理 ecshop中ajax的调用原理. 1.首先ecshop是如何定义ajax对象的. ecshop中的ajax对象是在js/transport.js文件中定义的.里面是 ...
随机推荐
- 客户端脚本语言javascript
2015.11.27 客户端脚本语言javascript. (叫这个名字的原因.想要攀高枝,希望变得和他一样通用.关于名字之间的关系类似于雷锋和雷峰塔,巴基斯坦和卡巴斯基,苏格拉底跟格拉苏蒂的关系一 ...
- Windows Thrift安装及HelloWorld
Thrift是一个facebook开源的高效RPC框架,其主要特点是跨语言及二进制高效传输(除了二进制,也支持json等常用序列化机制),官网地址:http://thrift.apache.org 跨 ...
- 闲话:你今天OO了吗?
如果你的分析习惯是在调研技术的时候最先弄清楚有多少业务流程,先画出业务流程图,然后顺藤摸瓜,找出业务流程中每一步骤的参与部门或岗位,弄清楚在这一步参与者所做的事情和填写表单的结果,并关心用户是如何把这 ...
- Yii::app()方法详解
Yii::app()方法详解 1.Yii::app()返回的是一个当前框架应用程序的对象 2.Yii::app()是framework/web/CWebApplication.php类实例化的对象,所 ...
- C#如何配置应用程序域
转载:http://www.csharpwin.com/csharpspace/9175r9023.shtml 您可以使用 AppDomainSetup 类,为新应用程序域提供带有配置信息的公共语言运 ...
- sqlite 数据库打开失败
今天在做Android电子词典的时候,数据库打不开,报错为:Could not open the database in read/write mode. 后来才发现犯了一个低级错误,没有设置权限. ...
- Calling startActivity() from outside of an Activity context requires the FLAG_ACTIVITY_NEW _TASK flag.
在Activity中使用startActivity()方法不会有任何限制,因为Activity重载了Context的startActivity()方法.但是如果是在其他地方(如Widget或Servi ...
- JDK版本过高,导致Eclipse报错
1.JDK版本如果比较高,而使用的eclipse版本比较低,导致在eclispe中不能识别而报错. 2.点击Attach Source添加rt.jar后,又出现如下错误 3.这样的错误就是由于ec ...
- Openfire:安装指南
本文的英文原文来自 http://www.igniterealtime.org/builds/openfire/docs/latest/documentation/install-guide.html ...
- 贪心算法:旅行商问题(TSP)
TSP问题(Traveling Salesman Problem,旅行商问题),由威廉哈密顿爵士和英国数学家克克曼T.P.Kirkman于19世纪初提出.问题描述如下: 有若干个城市,任何两个城市之间 ...