jQuery EasyUI ficha de base - bar Progressbar progresso
jQuery EasyUI plug-in
Por $ .fn.progressbar.defaults substituir os padrões predefinidos.
barra de progresso (progressbar) fornece uma visualização da contagem progresso da operação por um longo tempo. O progresso pode ser atualizado, a fim de que o usuário saiba a operação a ser realizada.
depender
- nenhum
uso
Criando uma barra de progresso (ProgressBar)
Progress bar (ProgressBar) componente pode criar tags de html ou programação criada. Criado a partir da marca mais fácil de classe "easyui-progressbar 'adicionado a tag <div>.
<Div id = classe "p" = "easyui-progresso"-opções de dados = "value: 60" style = "width: 400px;"> </ div>
Usar javascript para criar uma barra de progresso (ProgressBar).
<Div id = "p" style = "width: 400px;"> </ div>
$ ( "# P '). Progressbar ({ valor: 60 });
Obtém ou define o valor
Nós obter o valor atual do componente e para definir um novo valor.
var value = $ progressbar ( '# p') ( 'getValue') .; Se (valor <100) { Valor + = Math.floor (Math.random () * 10); . $ Progressbar ( 'setValue', value) ( '# P'); }
propriedade
名称 | 类型 | 描述 | 默认值 |
---|---|---|---|
width | string | 设置进度条(progressbar)的宽度。 | auto |
height | number | 组件的高度。该属性自版本 1.3.2 起可用。 | 22 |
value | number | 百分比值。 | 0 |
text | string | 显示在组件上的文本模板。 | {value}% |
evento
名称 | 参数 | 描述 |
---|---|---|
onChange | newValue,oldValue | 当值改变时触发。 代码实例: $('#p').progressbar({ onChange: function(value){ alert(value) } }); |
caminho
名称 | 参数 | 描述 |
---|---|---|
options | none | 返回选项(options)对象。 |
resize | width | 调整组件尺寸。 代码实例: $('#p').progressbar('resize'); // 调整进度条为初始宽度 $('#p').progressbar('resize', 350); // 调整进度条为一个新的宽度 |
getValue | none | 返回当前的进度值。 |
setValue | value | 设置一个新的进度值。 |
jQuery EasyUI plug-in