ProgressBar( 进度条) 组件

一． 加载方式

//class 加载方式
<div class="easyui-progressbar"
data-options="value:60" style="width:400px;">
</div>

//JS 加载调用
$('#box').progressbar({
value : 60,
});

二． 属性列表

//属性设置
$('#box').progressbar({
width : 400,
height : 30,
value : 60,
text : '{value}%',
});

三． 事件列表

$('#box').progressbar({
value : 60,
onChange : function (newValue, oldValue) {
console.log('新:' + newValue + ',旧:' + oldValue);
},
});
setTimeout(function () {
$('#box').progressbar('setValue', 70);
}, 1000);

//实现动画效果
setInterval(function () {
$('#box').progressbar('setValue',
$('#box').progressbar('getValue') + 5);
}, 200);

三．方法列表

//返回属性对象
console.log($('#box').progressbar('options'));

//设置组件长度
$('#box').progressbar('resize', '500');
//得到组件值
alert($('#box').progressbar('getValue'));
//设置组件值
$('#box').progressbar('setValue', '80');

PS：我们可以使用$.fn.progressbar.defaults 重写默认值对象。
$.fn.progressbar.defaults.value = '60';