Ext进度条

一、基本语法操作

<link rel="stylesheet" href="ext-3.2.1/resources/css/ext-all.css"/>
<script type="text/javascript" language="javascript" src="ext-3.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" language="javascript" src="ext-3.2.1/ext-all.js"></script>
<script type="text/javascript" language="javascript" src="ext-3.2.1/examples/shared/examples.js"></script>
<script type="text/javascript">
 Ext.onReady(function(){
   var pbar=new Ext.ProgressBar({
     id:'pbar',
     width:300,
     renderTo:Ext.getBody()
    });
   pbar.wait({
     interval:100,
     increment:15,
     duration:5000,
     text:'加载中,请稍候...'
    });
   var btn=new Ext.Button({
     text:'停止',
     handler:function(){
       pbar.reset();
       pbar.updateText("强制结束");
      },
     renderTo:Ext.getBody()
    });
  });
</script>

 

二、根据数据大小加载数据的进度条

var pbar=new Ext.ProgressBar({
     id:'pbar',
     width:300,
     renderTo:Ext.getBoyd()
    });
   var i=0;
   var task={
    run:function(){
      i+=0.1;
      pbar.updataProgress(i,"加载进度"+Math.random(i*100)+"%");
      if(Math.round(i*100)==100){
        pbar.updateText('加载完成');
        Ext.TaskMgr.stop(task);
       }
     },
     interval:500
   }
   Ext.TaskMgr.start(task);
  });