您当前的位置:首页 > 网站建设 > jQuery
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax | jQuery |

jQuery EasyUI 基础插件 - Progressbar 进度条

51自学网 2023-01-16 20:14:31
  jQuery

通过 $.fn.progressbar.defaults 重写默认的 defaults。

进度条(progressbar)提供了一种显示长时间操作进度的反馈。进度可被更新以便让用户知道当前正在执行的操作。

依赖

  • none

用法

创建进度条(ProgressBar)

进度条(ProgressBar)组件可以从 html 标记创建或者编程创建。从标记创建更容易些,把 'easyui-progressbar' class 加入到 <div> 标记。

<div id="p" class="easyui-progressbar" data-options="value:60" style="width:400px;"></div>

使用 javascript 创建进度条(ProgressBar)。

<div id="p" style="width:400px;"></div>
$('#p').progressbar({    value: 60});

获取或者设置值

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

var value = $('#p').progressbar('getValue');if (value < 100){    value += Math.floor(Math.random() * 10);    $('#p').progressbar('setValue', value);}

属性

名称 类型 描述默认值
width string 设置进度条(progressbar)的宽度。auto
height number 组件的高度。该属性自版本 1.3.2 起可用。22
value number 百分比值。0
text string 显示在组件上的文本模板。{value}%

事件

名称 参数 描述
onChange newValue,oldValue 当值改变时触发。
代码实例:
$('#p').progressbar({
下载地址:
jQuery EasyUI 基础插件 - Tooltip 提示框
jQuery EasyUI 基础插件 - Searchbox 搜索框
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1