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 相关文章推荐
关于event.cancelBubble和event.stopPropagation()的区别介绍
Dec 11 Javascript
动态添加删除表格行的js实现代码
Feb 28 Javascript
js获取url中的参数且参数为中文时通过js解码
Mar 19 Javascript
JavaScript框架(iframe)操作总结
Apr 16 Javascript
js实现的二级横向菜单条实例
Aug 22 Javascript
js实现获取两个日期之间所有日期的方法
Jun 17 Javascript
vue使用watch 观察路由变化,重新获取内容
Mar 08 Javascript
关于使用axios的一些心得技巧分享
Jul 02 Javascript
js实现把时间戳转换为yyyy-MM-dd hh:mm 格式(es6语法)
Dec 28 Javascript
ES6中let、const的区别及变量的解构赋值操作方法实例分析
Oct 15 Javascript
vue+elementui 对话框取消 表单验证重置示例
Oct 29 Javascript
vue配置型表格基于el-table拓展之table-plus组件
Apr 12 Vue.js
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压缩多个CSS为一个css的代码并缓存
2011/04/21 PHP
PHP+Mysql日期时间如何转换(UNIX时间戳和格式化日期)
2012/07/15 PHP
分享一个超好用的php header下载函数
2014/01/31 PHP
php抽象方法和普通方法的区别点总结
2019/10/13 PHP
JS DOM 操作实现代码
2010/08/01 Javascript
Jquery 自定义动画概述及示例
2013/03/29 Javascript
web前端设计师们常用的jQuery特效插件汇总
2014/12/07 Javascript
浅谈页面装载js及性能分析方法
2014/12/09 Javascript
jQuery中使用each处理json数据
2015/04/23 Javascript
Jquery实现$.fn.extend和$.extend函数
2016/04/14 Javascript
jQuery EasyUI Layout实现tabs标签的实例
2017/09/26 jQuery
nodejs连接mysql数据库及基本知识点详解
2018/03/20 NodeJs
Angular4 Select选择改变事件的方法
2018/10/09 Javascript
vue安装和使用scss及sass与scss的区别详解
2018/10/15 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
vue实现在进行增删改操作后刷新页面
2020/08/05 Javascript
Antd的table组件表格的序号自增操作
2020/10/27 Javascript
在antd中setFieldsValue和defaultVal的用法
2020/10/29 Javascript
Python中使用ElementTree解析XML示例
2015/06/02 Python
PyQT实现多窗口切换
2018/04/20 Python
Python进阶之自定义对象实现切片功能
2019/01/07 Python
Python实现读取txt文件中的数据并绘制出图形操作示例
2019/02/26 Python
Python使用itchat模块实现简单的微信控制电脑功能示例
2019/08/26 Python
pygame实现非图片按钮效果
2019/10/29 Python
python自动化实现登录获取图片验证码功能
2019/11/20 Python
Django单元测试中Fixtures用法详解
2020/02/25 Python
Python爬虫之Selenium中frame/iframe表单嵌套页面
2020/12/04 Python
理肤泉英国官网:La Roche-Posay英国
2019/01/14 全球购物
什么是serialVersionUID
2016/03/04 面试题
大学生职业生涯规划书前言
2014/01/09 职场文书
工程项目合作意向书
2015/05/08 职场文书
2015年妇委会工作总结
2015/05/22 职场文书
互联网创业商业模式以及赚钱法则有哪些?
2019/10/12 职场文书
基于nginx实现上游服务器动态自动上下线无需reload的实现方法
2021/03/31 Servers
SpringBoot+Vue+JWT的前后端分离登录认证详细步骤
2021/09/25 Java/Android
使用Mysql计算地址的经纬度距离和实时位置信息
2022/04/29 MySQL