easyui 进度条（ProgressBar）

最新推荐文章于 2024-03-21 16:11:35 发布

junmoxie

最新推荐文章于 2024-03-21 16:11:35 发布

阅读量5.8k

点赞数

CC 4.0 BY-SA版权

分类专栏： easyui js 文章标签： class html

本文链接：https://blog.youkuaiyun.com/ge_yulong/article/details/7777187

js 同时被 2 个专栏收录

99 篇文章

订阅专栏

easyui

9 篇文章

订阅专栏

本文介绍了如何使用EasyUI创建进度条组件，包括从HTML标记和编程方式。内容涉及设置进度条的值，获取当前值，以及组件的属性、事件和方法。示例代码展示了如何为<div>添加'easyui-progressbar'类以创建进度条，并动态更新其值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Create ProgressBar

The ProgressBar component can be created from html markup or programatically. Creation from markup is even easier. Add 'easyui-progressbar' class to <div/> markup.

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

Get or Set Value

We get the current value and set a new value for this component.

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

if (value < 100){  

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

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

}

Properties

Name	Type	Description	Default
width	string	Set the progressbar width.	auto
value	number	The percentage value.	0
text	string	The text template to be displayed on component.	{value}%

Events

Name	Parameters	Description
onChange	newValue,oldValue	Fires when the value is changed.

Methods

Name	Parameter	Description
options	none	Return the options object.
resize	width	Resize the component.
getValue	none	Return the current progress value.
setValue	value	Set a new progress value.