github
/
layui
mirror of https://github.com/layui/layui
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

新增 `input-number` 组件 `lay-precision` attributes，优化禁用视觉效果 (#1375) 

* 新增 `input-number`  组件 `lay-precision` attributes，优化禁用视觉效果
* update code
* refactor
pull/1381/head
morning-star 2023-09-20 13:16:11 +08:00 committed by GitHub
parent 6aa349b640
commit 4ab2a80f92
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 52 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/modules/form.js
View File

@ -174,6 +174,48 @@ layui.define(['lay', 'layer', 'util'], function(exports){
// 初始化全局的 autocomplete
options.autocomplete && inputs.attr('autocomplete', options.autocomplete);
var handleInputNumberEvents = function(elem, eventType){
var that = this;
var rawValue = elem.val();
var value = Number(rawValue);
var step = Number(elem.attr('step')) || 1; // 加减的数字间隔
var min = Number(elem.attr('min'));
var max = Number(elem.attr('max'));
var precision = Number(elem.attr('lay-precision'));
var noAction = eventType === 'blur' && rawValue === '' // 失焦时空值不作处理
if(isNaN(value)) return; // 若非数字，则不作处理
if(eventType === 'click'){
var isDecrement = !!$(that).index() // 0: icon-up, 1: icon-down
value = isDecrement ? value - step : value + step;
}
// 获取小数点后位数
var decimals = function(step){
var decimals = (step.toString().match(/\.(\d+$)/) || [])[1] || '';
return decimals.length;
};
precision = precision >= 0 ? precision : Math.max(decimals(step), decimals(rawValue));
if(!noAction){
if(value <= min) value = min;
if(value >= max) value = max;
if(precision) value = value.toFixed(precision);
elem.val(value)
}
// 更新按钮状态
var controlBtn = {
increment: elem.next().find('.layui-icon-up'),
decrement: elem.next().find('.layui-icon-down')
}
controlBtn.increment[(value >= max && !noAction) ? 'addClass' : 'removeClass'](DISABLED)
controlBtn.decrement[(value <= min && !noAction) ? 'addClass' : 'removeClass'](DISABLED)
}
// 初始化输入框动态点缀
elemForm.find('input[lay-affix],textarea[lay-affix]').each(function(){
var othis = $(this);
@ -248,6 +290,11 @@ layui.define(['lay', 'layer', 'util'], function(exports){
var value = this.value;
opts.show === 'auto' && showAffix(elemAffix, value);
});
// 失去焦点事件
othis.on('blur', function(){
typeof opts.blur === 'function' && opts.blur.call(this, othis, opts);
});
// 点击动态后缀事件
elemIcon.on('click', function(){
@ -295,35 +342,11 @@ layui.define(['lay', 'layer', 'util'], function(exports){
className: 'layui-input-number',
disabled: othis.is('[disabled]'), // 跟随输入框禁用状态
click: function(elem){
var index = $(this).index();
var value = elem.val();
var rawValue = value;
var step = Number(elem.attr('step')) || 1; // 加减的数字间隔
var min = Number(elem.attr('min'));
var max = Number(elem.attr('max'));
if(isNaN(value)) return; // 若非数字，则不作处理
value = Number(value);
value = index ? value - step : value + step;
// min max
if(value < min) value = min;
if(value > max) value = max;
// 获取小数点后位数
var decimals = function(step){
var decimals = (step.toString().match(/\.(\d+$)/) || [])[1] || '';
return decimals.length;
};
// 位数比较
var fixed = Math.max(decimals(step), decimals(rawValue));
if(fixed) value = value.toFixed(fixed);
elem.val(value);
}
handleInputNumberEvents.call(this, elem, 'click')
},
blur: function(elem){
handleInputNumberEvents.call(this, elem, 'blur')
},
}
};