//使用此组件之前，必须先调用组件初始化函数，否则组件会运行的不正常 JProgressBar.init();
//创建一个宽300，高20,默认进度值为500，最大进度值为500的水平方向的进度条
new JProgressBar({
width:500,
height:20,
maxValue:500,
value:500
});
//由于没有指定renderTo属性，所以默认的采用了document.write来输出到当前调用所在元素中
new JProgressBar({
....
renderTo:"进度条所在父元素，接受Element类型值和字符串类型值,字符串类型值被当做ID值来获取对应元素"
/*
* 如:
* renderTo:"e1-v-show"
* 或
* renderTo:document.getElementById("el-l-show")
*/
....
});
| #e1-v-show | #e1-l-show |
new JProgressBar({
....
direction:"进度条的方向，值为v时进度条的方向是垂直的，值为l时进度条方向是水平的，默认是值是l"
width:"进度条宽度",
height:"进度条高度"
....
});
方向：
宽度：px
高度：px
new JProgressBar({
....
text:"字符串中出现的{#maxValue},{#value},{#pct} 分别表示，同时也会被替换为 进度条的最大值，当前进度值，当前进度值的百分比值"
....
});
//也可以用
JProgressBar实例对象.text ="...."; //替换默认
//或
JProgressBar实例对象.setText("...."); //即使修改显示的文本值
//或
JProgressBar.setText(JProgressBar实例对象或ID,"....");
自定义文本：
使用：
//进度值接受普通数值（正数），和百分比格式的值
new JProgressBar({
....
value:"进度条初始化进度",
maxValue:"最大进度值"
....
});
//修改 进度值
//也可以用
JProgressBar实例对象.setValue(值,是否使用缓动效果);
//或
JProgressBar.setValue(JProgressBar实例对象或ID,值,是否使用缓动效果);
//修改最大进度值
JProgressBar实例.maxValue="最大进度值"
进度值：
最大进度值：
效果
//通过给定样式类来改变进度条的样式
new JProgressBar({
....
cls:"样式类"
....
});
/*
* 样式定义说明
* .样式类 进度条最外层框
* .样式类 .block 进度条块
* .样式类 .highlight 高亮显示的块
* .样式类 .text 文本
* .样式类 .text-mask .text 遮照文本
*/
/*
* 实际事件名在构造函数中对应的属性名
* onBeforeRender 对应 属性名 breforeRender 触发在进度条被渲染之前
* onRender 对应 属性名 render 触 发在进度条被渲染完成后
* onBeforeDestroy 对应 属性名 breforeRender 触发在进度条被销毁之前
* onDestroy 对应 属性名 destroy 触发在进度条被销毁后
* onProgressChange 对应 属性名 progressChange 触发在进度条进度被改变后
* onProgressChange 事件参数列表
* arguments[0] 进度条的进度值
* arguments[1] 进度条的进度值百分比格式
* arguments[2] 进度条的最大进度值
* onProgressed 对应 属性名 progressed 触发在进度条 进度移动到某个进度完成之后
* onComplete 对应 属性名 complete 触发在进度条进度达到100%时
*/
//构造函数设置
new JProgressBar({
....
事件:function(){...}
....
});
//通过JProgressBar实例对象来设置
JProgressBar实例对象.事件=function(){....}
//由于频繁的对文本域的值进行修改，所以进度条的缓效果可能会变的很不流畅
| 显示1 | 显示2 | 显示3 | 显示4 | 显示5 |