EasyUI Spinner 微调器

扩展自 $.fn.validatebox.defaults。通过 $.fn.spinner.defaults 重写默认的 defaults。

微调器（spinner）把可编辑的文本框和两个小按钮结合起来，允许用户从某个范围的值中进行选择。与组合框（combobox）相似，微调器（spinner）允许用户输入一个值，但是它买i有下拉列表。微调器（spinner）是创建其他微调器组件（比如：数值微调器 numberspinner、时间微调器 timespinner，等等）的基础组件。

依赖

• validatebox

用法

微调器（spinner）应该使用 javascript 进行创建。从标记创建是不允许的。

<input id="ss" value="2">

$(‘#ss‘).spinner({
    required:true,
    increment:10
});

属性

该属性扩展自验证框（validatebox），下面是为微调器（spinner）添加的属性。

事件

方法

该方法扩展自验证框（validatebox），下面是为微调器（spinner）添加的方法。

EasyUI Numberspinner 数值微调器

扩展自 $.fn.spinner.defaults 和 $.fn.numberbox.defaults。通过 $.fn.numberspinner.defaults 重写默认的 defaults。

数值微调器（numberspinner）是基于微调器（spinner）和数字框（numberbox）创建的。它可以把输入值转换为不同类型（比如：数字 numeric、百分比 percentage、货币 currency，等等）。它允许用户使用向上/向下微调按钮滚动到一个期望值。

依赖

• spinner
• numberbox

用法

从标记创建数值微调器（numberspinner）。

<input id="ss" class="easyui-numberspinner" style="width:80px;"
    required="required" data-options="min:10,max:100,editable:false">

使用 javascript 创建数值微调器（numberspinner）。

<input id="ss" required="required" style="width:80px;">

$(‘#ss‘).numberspinner({
    min: 10,
    max: 100,
    editable: false
});

创建数值微调器（numberspinner），并把数字格式化为货币字符串。

<input class="easyui-numberspinner" value="1234567890" style="width:150px;"
    data-options="required:true,precision:2,groupSeparator:‘,‘,decimalSeparator:‘.‘,prefix:‘$‘">

属性

该属性扩展自微调器（spinner）和数字框（numberbox）。

事件

该事件扩展自微调器（spinner）。

方法

该方法扩展自微调器（spinner），下面是为数值微调器（numberspinner）重写的方法。

EasyUI Timespinner 时间微调器

扩展自 $.fn.spinner.defaults。通过 $.fn.timespinner.defaults 重写默认的 defaults。

时间微调器（timespinner）是基于微调器（spinner）创建的。它与数值微调器（numberspinner）相似，但是它只显示时间值。时间微调器（timespinner）允许用户通过点击组件右侧的小微调按钮来增加或减少时间。

依赖

• spinner

用法

从标记创建时间微调器（timespinner）。

<input id="ss" class="easyui-timespinner" style="width:80px;"
    required="required" data-options="min:‘08:30‘,showSeconds:true">

使用 javascript 创建时间微调器（timespinner）。

<input id="ss" style="width:80px;">

$(‘#ss‘).timespinner({
    min: ‘08:30‘,
    required: true,
    showSeconds: true
});

属性

该属性扩展自微调器（spinner），下面是为时间微调器（timespinner）添加的属性。

事件

该事件扩展自微调器（spinner）。

方法

该方法扩展自微调器（spinner），下面是为时间微调器（timespinner）重写的方法。

EasyUI Slider 滑块

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

滑块（slider）允许用户从一个有限的范围内选择一个数值。当沿着轨道移动滑块控件时，将显示一个表示当前值的提示框，用户可通过设置它的属性来自定义滑块。

依赖

• draggable

用法

当作为一个表单域使用时，从 <input> 标记创建滑块（slider）。

<input class="easyui-slider" value="12" style="width:300px"
    data-options="showTip:true,rule:[0,‘|‘,25,‘|‘,50,‘|‘,75,‘|‘,100]">

从 <div> 创建滑块（slider）也是允许的，但是 ‘value‘ 属性是无效的。

<div class="easyui-slider" data-options="min:10,max:90,step:10" style="width:300px"></div>

变成创建滑块（slider）。

<div id="ss" style="height:200px"></div>

$(‘#ss‘).slider({
    mode: ‘v‘,
    tipFormatter: function(value){
        return value + ‘%‘;
    }
});

属性

事件

方法