js 异步处理进度条_Javascript教程-查字典教程网
js 异步处理进度条
js 异步处理进度条
发布时间:2016-12-30 来源:查字典编辑
摘要:1.先上图,效果如下:2.使用方法复制代码代码如下:varloader=newAjaxloader(this._ContentID,{Tex...

1.先上图,效果如下:

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教程学习
    热门Javascript教程学习
    编程开发子分类