jQuery EasyUI - 进度条

源：http://www.cnblogs.com/hantianwei/archive/2012/03/19/2407043.html
评：

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


设置一个新的进度值。