js 异步处理进度条


Posted in Javascript onApril 01, 2010

1.先上图,效果如下:

js 异步处理进度条

2.使用方法

var loader=new Ajaxloader(this._ContentID,{Text:'loading......',Top:50}); 
loader.Show();

3.代码列出:
/* 
处理进度条,异步加载器 
*/ 
var Ajaxloader=new Class(); 
Ajaxloader.prototype= 
{ 
Text:'数据加载中......', 
Parent:null, 
Left:0, 
Top:30, 
Initialize:function(parentid,o) 
{ 
//alert('Init'); 
Extend(this,o); 
if(parentid) 
{ 
this.Parent=$(parentid); 
} 
return this; 
}, 
Show:function() 
{ 
if(this.Parent) 
{ 
var _obj = this.Create(); 
this.Parent.appendChild(_obj); 
} 
}, 
Create:function() 
{ 
var _div=document.createElement('div'); 
var _img=document.createElement('img'); 
_img.src='<%=WebResource("DSKJ.Web.UI.WebControls.Images.ajaxloader.gif")%>'; 
_img.style.cssText='display:block;'; 
var _load=document.createElement('h3'); 
_load.innerText = this.Text; 
_load.style.cssText='margin-top:5px;font-size:13px'; 
_div.appendChild(_img); 
_div.appendChild(_load); 
//设置div样式 
_div.style.cssText='font-size:13px;text-align:center;margin:0 auto;display:block;z-Index:99'; 
_div.style.marginTop=this.Top; 
return _div; 
} 
}

4.结束语
欢迎拍砖
Javascript 相关文章推荐
csdn 博客中实现运行代码功能实现
Aug 29 Javascript
javascript实现锁定网页、密码解锁效果(类似系统屏幕保护效果)
Aug 15 Javascript
node.js集成百度UE编辑器
Feb 05 Javascript
javascript制作网页图片上实现下雨效果
Feb 26 Javascript
JavaScript必知必会(七)js对象继承
Jun 08 Javascript
详解vue2路由vue-router配置(懒加载)
Apr 08 Javascript
JS ES6多行字符串与连接字符串的表示方法
Apr 26 Javascript
ES6中新增的Object.assign()方法详解
Sep 22 Javascript
微信小程序实现的点击按钮 弹出底部上拉菜单功能示例
Dec 20 Javascript
jquery操作checkbox的常用方法总结【附测试源码下载】
Jun 10 jQuery
react 不用插件实现数字滚动的效果示例
Apr 14 Javascript
微信小程序语音同步智能识别的实现案例代码解析
May 29 Javascript
JavaScript中String和StringBuffer的速度之争
Apr 01 #Javascript
Cookie 小记
Apr 01 #Javascript
javascript操作cookie的文章(设置,删除cookies)
Apr 01 #Javascript
在模板页面的js使用办法
Apr 01 #Javascript
使用Microsoft Ajax Minifier减小JavaScript文件大小的方法
Apr 01 #Javascript
JS控制显示隐藏兼容问题(IE6、IE7、IE8)
Apr 01 #Javascript
JavaScript 轻松搞定快捷留言功能 只需一行代码
Apr 01 #Javascript
You might like
使用PHP和XSL stylesheets转换XML文档
2006/10/09 PHP
调整优化您的LAMP应用程序的5种简单方法
2011/06/26 PHP
php代码运行时间查看类代码分享
2011/08/06 PHP
php使用ereg验证文件上传的方法
2014/12/16 PHP
PHP基础之输出缓冲区基本概念、原理分析
2019/06/19 PHP
JavaScript 用Node.js写Shell脚本[译]
2012/09/20 Javascript
javascript 实现 秒杀,团购 倒计时展示的记录 分享
2013/07/12 Javascript
验证控件与Button的OnClientClick事件详细解析
2013/12/04 Javascript
JavaScript DOM基础
2015/04/13 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
2015/07/29 Javascript
JavaScript中的数据类型转换方法小结
2015/10/26 Javascript
原生js实现下拉框功能(支持键盘事件)
2017/01/13 Javascript
原生js实现类似fullpage的单页/全屏滚动
2017/01/22 Javascript
js实现兼容PC端和移动端滑块拖动选择数字效果
2017/02/16 Javascript
详解Vue依赖收集引发的问题
2019/04/22 Javascript
推荐几个不错的console调试技巧实现
2019/12/20 Javascript
编程语言Python的发展史
2014/09/26 Python
python实现在目录中查找指定文件的方法
2014/11/11 Python
在Python中测试访问同一数据的竞争条件的方法
2015/04/23 Python
Python中使用platform模块获取系统信息的用法教程
2016/07/08 Python
Python爬虫之xlml解析库(全面了解)
2017/08/08 Python
Python最火、R极具潜力 2017机器学习调查报告
2017/12/11 Python
浅谈配置OpenCV3 + Python3的简易方法(macOS)
2018/04/02 Python
Python实现基于C/S架构的聊天室功能详解
2018/07/07 Python
django.db.utils.ProgrammingError: (1146, u“Table‘’ doesn’t exist”)问题的解决
2018/07/13 Python
Pycharm代码无法复制,无法选中删除,无法编辑的解决方法
2018/10/22 Python
Python选择网卡发包及接收数据包
2019/04/04 Python
eBay瑞士购物网站:eBay.ch
2018/12/24 全球购物
DogBuddy荷兰:找到你最完美的狗保姆
2019/04/17 全球购物
南京软件公司的.net程序员笔试题
2014/08/31 面试题
员工评语大全
2014/01/19 职场文书
入党积极分子自我鉴定范文
2014/03/25 职场文书
大学新生入学教育方案
2014/05/16 职场文书
大学生创业事迹材料
2014/12/30 职场文书
美丽的大脚观后感
2015/06/03 职场文书
董事长致辞
2015/07/29 职场文书