Heim > Web-Frontend > js-Tutorial > js 异步处理进度条_javascript技巧

js 异步处理进度条_javascript技巧

WBOY
Freigeben: 2016-05-16 18:30:48
Original
1434 Leute haben es durchsucht

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='';
_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.结束语
欢迎拍砖
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage