本节课重点了解 EasyUI 中 Spinner(微调)组件的使用方法,这个组件依赖于
Spinner(微调)组件。
一. 加载方式
//class 加载方式
<input id="box" class="easyui-timespinner">
//JS 加载调用
$('#box').timespinner({
value : '00:00',
min : '00:00',
max : '23:59',
editable : false,
});
二.属性列表
//属性设置
$('#box').timespinner({
value : '00:00',
min : '00:00',
max : '23:59',
editable : false,
separator : '/',
showSeconds : true,
highlight : 1,
});
三. 事件列表
TimeSpinner(时间微调)组件继承自 Spinner(微调)组件。
//事件列表
$('#box').spinner({
onSpinUp : function () {
},
onSpinDown : function () {
},
});
四. 方法列表
//取值赋值
$('#box').numberspinner('setValue', '17:11');
$('#box').numberspinner('getValue');
//获取时分秒
$(document).click(function () {
console.log($('#box').timespinner('getHours'));
console.log($('#box').timespinner('getMinutes'));
console.log($('#box').timespinner('getSeconds'));
});
PS:我们可以使用$.fn.timespinner.defaults 重写默认值对象。