本节课重点了解 EasyUI 中 Spinner(微调)组件的使用方法,这个组件依赖于
Numberbox(数值输入框)和 Spinner(微调)组件。
一. 加载方式
//class 加载方式
<input id="box" class="easyui-numberspinner">
//JS 加载调用
$('#box').numberspinner({
value : 10,
increment : 10,
min : 10,
max : 500,
});
二. 属性列表
NumberSpinner(数字微调)组件继承自 Spinner(微调)组件。
//属性设置
$('#box').spinner({
required : true,
width : 200,
height : 50,
value : 2,
min : 1,
max : 500,
increment : 1,
editable : false,
disabled : false,
spin : function (down) {
alert(down);
},
});
三. 事件列表
NumberSpinner(数字微调)组件继承自 Spinner(微调)组件。
//事件列表
$('#box').spinner({
onSpinUp : function () {
},
onSpinDown : function () {
},
});
四. 方法列表
NumberSpinner(数字微调)组件继承自 Spinner(微调)组件。
//取值赋值
$('#box').numberspinner('setValue', 100);
$('#box').numberspinner('getValue');
PS:我们可以使用$.fn.numberspinner.defaults 重写默认值对象。