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文件中定义的.里面是 ...
随机推荐
- 转:ORACLEERP开发基础之EBS开发基础
转自:http://blog.itpub.net/8781091/viewspace-1012244/ [内容导航] 第1页:开发工具安装 第2页:增加数据块 第3页:注册表单FORM 第4页:注册请 ...
- HttpClient4.4 进行Http连接通讯
以前一直使用jdk自带的urlConnection来进行http通讯,HttpClient与之相比,HttpClient更具有灵活度和易用性.HttpClient能够方便使用连接池,使用时需要重新创建 ...
- window nodejs 版本切换 nvmw
参考文档:https://cnodejs.org/topic/5338c5db7cbade005b023c98 nvmw 下载到本地 git clone https://github.com/hako ...
- Unity 3D 文件导入出错误解决方法以及unity圣典离线版下载地址
1.安装unity 时我选择了free版的,打开已有项目时出现如下错误提示. 解决方法:先把要导入的文件先拷贝到unity3d安装目录下对应的文件夹内,之后再返回unity3d软件,右键选择“导入”. ...
- ionic(一) build你的第一个android apk
1.ionic start myApp tabs >>创建一个app 2.cd myApp >>进入myApp文件 3.ionic platform add andro ...
- VS2010修改默认配置路径
视图->属性管理器 弹出如下截图:
- Peter Pan By: J. M. Barrie
Audio book: (mp3+txt) http://www.booksshouldbefree.com/book/peter-pan-by-j-m-barrie
- PHP正则表达式 验证电子邮件地址
我们最经常遇到的验证,就是电子邮件地址验证.网站上常见.各种网页脚本也都常用“正则表达式”(regular expression)对我们输入的电子邮件地址进行验证,判断是否合法.有的还能分解出用户名和 ...
- 【Asp.Net】小BUG汇总[更新]
目录结构 1.Dictionary<T>遍历 2.Asp.net网站部署在C盘无法上传下载文件 3.Asp.Net网站发布后远程无法访问 4.GDI+中发生一般性错误 1.Dictiona ...
- wamp的mysql密码修改
==方法1== 通过WAMP打开mysql控制台,提示输入密码,因为现在是空,所以直接按回车. 输入“use mysql”,意思是使用mysql这个数据库教程,提示“Database changed” ...