jQuery EasyUI - 进度条

评：

function progressbar() { 

 $('#progressbarDiv').window({closable:false}); 

 $("#progressbarDiv").window("open"); 

 $("#progressbarDiv").css("display", "block"); 

 $('#p').progressbar('setValue', 1); 

 str = "selIds:" + selIds + ";num:" + num; 

 //$.messager.alert("aa", str); 

 //getRateAjax(); 

 //setTimeout(getRateAjax, 400); 

 timer = setInterval("getRateAjax()", 100); 


} 


function getRateAjax() { 

 callcount++; 

 //$.messager.alert("aa", "callcount:" + callcount); 

 $.ajax({ 

 type: "post", 

 url: "${pageContext.request.contextPath}/getBonusTransferRate.action", 

 data: { 

 sleIds :selIds, 

 num: num}, 

 success: function(data) { 

 var data = eval（"(" + data + ")"); 

 if(data.result < 100 && data.result >1) { 

 //$.messager.alert("aa", data.result); 

 $('#p').progressbar('setValue', data.result); 

 } 

 } 

 }); 

} 



$('#p').progressbar('setValue', 100); 

 setTimeout(function(){ 

 $('#progressbarDiv').css("display","none"); 

 $('#p').progressbar('setValue', 0); 

 $('#progressbarDiv').window('close'); 

 }, 1000); 


 <!-- 进度条 --> 

 <div id="progressbarDiv" class="easyui-window" 

 style="width: 414px; display: none;" 

 data-options="title:'还款进度',modal:true,collapsible:false,minimizable:false, 

 maximizable:false,closed:true"> 

 请耐心等待,请勿刷新当前页面！ 

 <div id="p" class="easyui-progressbar" style="width:400px;"> 

 </div>

-----------------
ProgressBar 进度条

用$.fn.progressbar.defaults重写defaults。

依赖

none

用法示例

创建ProgressBar

ProgressBar能够从html标记创建或者编程创建。从标记创建更容易些，把 'easyui-progressbar' 类加入到<div/>标记。

1. <div id="p" class="easyui-progressbar" style="width:400px;"></div>

获取或者设置值

我们获取当前值并且给这个组件设置一个新值。

1. var value = $('#p').progressbar('getValue');

2. if (value < 100){

3. value += Math.floor(Math.random() * 10);

4. $('#p').progressbar('setValue', value);

5. }
特性

名称


类型


说明


默认值

width


string


设置progressbar的宽度。


auto

value


number


百分比值。


0

text


string


显示在组件上的文字的模板。


{value}%
事件

名称


参数


说明

onChange


newValue,oldValue


当值改变的时候触发。
方法

名称


参数


说明

options


none


返回options对象。

resize


width


调整组件尺寸。

getValue


none


返回当前的进度值。

setValue


value


设置一个新的进度值。