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 相关文章推荐
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
Feb 10 Javascript
简介JavaScript中getUTCMonth()方法的使用
Jun 10 Javascript
Jquery简单分页实现方法
Jul 24 Javascript
JS自动倒计时30秒后按钮才可用(两种场景)
Aug 31 Javascript
jQuery实现表格行和列的动态添加与删除方法【测试可用】
Aug 01 Javascript
Bootstrap对话框使用实例讲解
Sep 24 Javascript
使用mock.js随机数据和使用express输出json接口的实现方法
Jan 07 Javascript
Vue核心概念Getter的使用方法
Jan 18 Javascript
layui实现三级导航菜单
Jul 26 Javascript
layui使用数据表格实现购物车功能
Jul 26 Javascript
一个手写的vue放大镜效果
Aug 09 Javascript
解决vue-router 切换tab标签关闭时缓存问题
Jul 22 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的FTP学习(四)
2006/10/09 PHP
Twig模板引擎用法入门教程
2016/01/20 PHP
详解如何在云服务器上部署Laravel
2017/06/30 PHP
Laravel5.5新特性之友好报错以及展示详解
2017/08/13 PHP
ThinkPHP5.0框架控制器继承基类和自定义类示例
2018/05/25 PHP
laravel 去掉index.php伪静态的操作方法
2019/10/12 PHP
初学JavaScript第二章
2008/09/30 Javascript
jquery 批量上传图片实现代码
2010/01/28 Javascript
Javascript中string转date示例代码
2013/11/01 Javascript
JS、DOM和JQuery之间的关系示例分析
2014/04/09 Javascript
解决vue-cli 打包后自定义动画未执行的问题
2019/11/12 Javascript
vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题
2020/04/14 Javascript
jquery+ajax实现异步上传文件显示进度条
2020/08/17 jQuery
vue实现广告栏上下滚动效果
2020/11/26 Vue.js
[01:32]2016国际邀请赛中国区预选赛IG战队首日赛后采访
2016/06/27 DOTA
Python 的描述符 descriptor详解
2016/02/27 Python
Django数据库表反向生成实例解析
2018/02/06 Python
Python 解决中文写入Excel时抛异常的问题
2018/05/03 Python
django模板结构优化的方法
2019/02/28 Python
python读取并定位excel数据坐标系详解
2019/06/26 Python
Django框架HttpRequest对象用法实例分析
2019/11/01 Python
Pytorch自己加载单通道图片用作数据集训练的实例
2020/01/18 Python
Django ORM 查询表中某列字段值的方法
2020/04/30 Python
Python中SQLite如何使用
2020/05/27 Python
如何利用python检测图片是否包含二维码
2020/10/15 Python
收藏!10个免费高清视频素材网站!【设计、视频剪辑必备】
2021/03/18 杂记
Invicta手表官方商店:百年制表历史的瑞士腕表品牌
2019/09/26 全球购物
用JAVA实现一种排序,JAVA类实现序列化的方法(二种)
2014/04/23 面试题
厨房领班竞聘演讲稿
2014/04/23 职场文书
竞选班干部演讲稿600字
2014/08/20 职场文书
妇联领导班子剖析材料
2014/08/21 职场文书
关于晚自习早退的检讨书
2014/09/13 职场文书
2016年春季开学典礼新闻稿
2015/11/25 职场文书
2016年安康杯竞赛活动总结
2016/04/05 职场文书
python某漫画app逆向
2021/03/31 Python
win10搭建配置ftp服务器的方法
2022/08/05 Servers