优化 rate 和 slider 代码细节 (#1374)

* 添加注释和代码简化
pull/1378/head
火烈鸟 2023-09-18 16:28:07 +08:00 committed by GitHub
parent 28934ead71
commit c7d6cf90c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 70 additions and 70 deletions

View File

@ -64,7 +64,7 @@ layui.define(['jquery', 'lay'],function(exports){
readonly: false, //是否只读 readonly: false, //是否只读
half: false, //是否可以半星 half: false, //是否可以半星
value: 0, //星星选中个数 value: 0, //星星选中个数
theme: '' theme: '' //主题颜色
}; };
//评分渲染 //评分渲染

View File

@ -111,10 +111,10 @@ layui.define(['jquery', 'lay'], function(exports){
options.value = typeof(options.value) == 'object' ? options.value : [options.min, options.value]; options.value = typeof(options.value) == 'object' ? options.value : [options.min, options.value];
var minValue = Math.min(options.value[0], options.value[1]) var minValue = Math.min(options.value[0], options.value[1])
,maxValue = Math.max(options.value[0], options.value[1]); ,maxValue = Math.max(options.value[0], options.value[1]);
options.value[0] = minValue > options.min ? minValue : options.min; options.value[0] = Math.max(minValue,options.min);
options.value[1] = maxValue > options.min ? maxValue : options.min; options.value[1] = Math.max(maxValue,options.min);
options.value[0] = options.value[0] > options.max ? options.max : options.value[0]; options.value[0] = Math.min(options.value[0],options.max);
options.value[1] = options.value[1] > options.max ? options.max : options.value[1]; options.value[1] = Math.min(options.value[1],options.max);
var scaleFir = Math.floor((options.value[0] - options.min) / (options.max - options.min) * 100) var scaleFir = Math.floor((options.value[0] - options.min) / (options.max - options.min) * 100)
,scaleSec = Math.floor((options.value[1] - options.min) / (options.max - options.min) * 100) ,scaleSec = Math.floor((options.value[1] - options.min) / (options.max - options.min) * 100)
@ -132,7 +132,7 @@ layui.define(['jquery', 'lay'], function(exports){
if(options.value > options.max) options.value = options.max; if(options.value > options.max) options.value = options.max;
var scale = Math.floor((options.value - options.min) / (options.max - options.min) * 100) + '%'; var scale = Math.floor((options.value - options.min) / (options.max - options.min) * 100) + '%';
}; }
//如果禁用,颜色为统一的灰色 //如果禁用,颜色为统一的灰色
@ -155,7 +155,7 @@ layui.define(['jquery', 'lay'], function(exports){
that.elemTemp.find('.' + SLIDER_WRAP).eq(1).data('value', options.value[1]); that.elemTemp.find('.' + SLIDER_WRAP).eq(1).data('value', options.value[1]);
}else{ }else{
that.elemTemp.find('.' + SLIDER_WRAP).data('value', options.value); that.elemTemp.find('.' + SLIDER_WRAP).data('value', options.value);
}; }
//插入替代元素 //插入替代元素
othis.html(that.elemTemp); othis.html(that.elemTemp);
@ -163,7 +163,7 @@ layui.define(['jquery', 'lay'], function(exports){
//垂直滑块 //垂直滑块
if(options.type === 'vertical'){ if(options.type === 'vertical'){
that.elemTemp.height(options.height + 'px'); that.elemTemp.height(options.height + 'px');
}; }
//显示间断点 //显示间断点
if(options.showstep){ if(options.showstep){
@ -173,9 +173,9 @@ layui.define(['jquery', 'lay'], function(exports){
if(step < 100){ if(step < 100){
item += '<div class="layui-slider-step" style="'+ (options.type === 'vertical' ? 'bottom' : 'left') +':'+ step +'%"></div>' item += '<div class="layui-slider-step" style="'+ (options.type === 'vertical' ? 'bottom' : 'left') +':'+ step +'%"></div>'
} }
}; }
that.elemTemp.append(item); that.elemTemp.append(item);
}; }
//插入输入框 //插入输入框
if(options.input && !options.range){ if(options.input && !options.range){
@ -191,7 +191,7 @@ layui.define(['jquery', 'lay'], function(exports){
} else { } else {
that.elemTemp.css("margin-right", elemInput.outerWidth() + 15); that.elemTemp.css("margin-right", elemInput.outerWidth() + 15);
} }
}; }
//给未禁止的滑块滑动事件 //给未禁止的滑块滑动事件
if(!options.disabled){ if(!options.disabled){
@ -199,7 +199,7 @@ layui.define(['jquery', 'lay'], function(exports){
}else{ }else{
that.elemTemp.addClass(DISABLED); that.elemTemp.addClass(DISABLED);
that.elemTemp.find('.' + SLIDER_WRAP_BTN).addClass(DISABLED); that.elemTemp.find('.' + SLIDER_WRAP_BTN).addClass(DISABLED);
}; }
//划过滑块显示数值 //划过滑块显示数值
var timer; var timer;
@ -225,7 +225,7 @@ layui.define(['jquery', 'lay'], function(exports){
"left": left + '%', "left": left + '%',
"display": "inline-block" "display": "inline-block"
}); });
}; }
}, 300); }, 300);
}).on('mouseout', function(){ }).on('mouseout', function(){
clearTimeout(timer); clearTimeout(timer);
@ -250,7 +250,7 @@ layui.define(['jquery', 'lay'], function(exports){
offsetValue = Math.ceil(offsetValue) * step offsetValue = Math.ceil(offsetValue) * step
}else{ }else{
offsetValue = Math.round(offsetValue) * step offsetValue = Math.round(offsetValue) * step
}; }
offsetValue = offsetValue > 100 ? 100: offsetValue; offsetValue = offsetValue > 100 ? 100: offsetValue;
offsetValue = offsetValue < 0 ? 0: offsetValue; offsetValue = offsetValue < 0 ? 0: offsetValue;
sliderWrap.eq(index).css((options.type === 'vertical' ?'bottom':'left'), offsetValue + '%'); sliderWrap.eq(index).css((options.type === 'vertical' ?'bottom':'left'), offsetValue + '%');
@ -262,7 +262,7 @@ layui.define(['jquery', 'lay'], function(exports){
secLeft = options.range ? valueTo(sliderWidth() - sliderWrap[1].offsetTop - sliderWrap.height()) : 0; secLeft = options.range ? valueTo(sliderWidth() - sliderWrap[1].offsetTop - sliderWrap.height()) : 0;
}else{ }else{
sliderAct.find('.' + SLIDER_TIPS).css("left",offsetValue + '%'); sliderAct.find('.' + SLIDER_TIPS).css("left",offsetValue + '%');
}; }
firLeft = firLeft > 100 ? 100: firLeft; firLeft = firLeft > 100 ? 100: firLeft;
secLeft = secLeft > 100 ? 100: secLeft; secLeft = secLeft > 100 ? 100: secLeft;
var minLeft = Math.min(firLeft, secLeft) var minLeft = Math.min(firLeft, secLeft)
@ -271,7 +271,7 @@ layui.define(['jquery', 'lay'], function(exports){
sliderAct.find('.' + SLIDER_BAR).css({"height":wrapWidth + '%', "bottom":minLeft + '%'}); sliderAct.find('.' + SLIDER_BAR).css({"height":wrapWidth + '%', "bottom":minLeft + '%'});
}else{ }else{
sliderAct.find('.' + SLIDER_BAR).css({"width":wrapWidth + '%', "left":minLeft + '%'}); sliderAct.find('.' + SLIDER_BAR).css({"width":wrapWidth + '%', "left":minLeft + '%'});
}; }
var selfValue = options.min + Math.round((options.max - options.min) * offsetValue / 100); var selfValue = options.min + Math.round((options.max - options.min) * offsetValue / 100);
inputValue = selfValue; inputValue = selfValue;
sliderTxt.children('.' + SLIDER_INPUT_TXT).children('input').val(inputValue); sliderTxt.children('.' + SLIDER_INPUT_TXT).children('input').val(inputValue);
@ -298,7 +298,7 @@ layui.define(['jquery', 'lay'], function(exports){
,left = Math.round(oldLeft) * step; ,left = Math.round(oldLeft) * step;
if(value == sliderWidth()){ if(value == sliderWidth()){
left = Math.ceil(oldLeft) * step; left = Math.ceil(oldLeft) * step;
}; }
return left; return left;
} }
@ -329,7 +329,7 @@ layui.define(['jquery', 'lay'], function(exports){
if(options.type === 'vertical'){ if(options.type === 'vertical'){
oldleft = sliderWidth() - othis.parent()[0].offsetTop - sliderWrap.height() oldleft = sliderWidth() - othis.parent()[0].offsetTop - sliderWrap.height()
oldx = e.clientY; oldx = e.clientY;
}; }
var move = function(e){ var move = function(e){
e = e || window.event; e = e || window.event;
@ -373,7 +373,7 @@ layui.define(['jquery', 'lay'], function(exports){
} }
} else { } else {
index = 0; index = 0;
}; }
change(reaLeft, index, 'done'); change(reaLeft, index, 'done');
e.preventDefault(); e.preventDefault();
} }
@ -391,7 +391,7 @@ layui.define(['jquery', 'lay'], function(exports){
inputValue = Number(inputValue) + options.step > options.max inputValue = Number(inputValue) + options.step > options.max
? options.max ? options.max
: Number(inputValue) + options.step; : Number(inputValue) + options.step;
}; }
var inputScale = (inputValue - options.min) / (options.max - options.min) * 100 / step; var inputScale = (inputValue - options.min) / (options.max - options.min) * 100 / step;
change(inputScale, 0, 'done'); change(inputScale, 0, 'done');
}); });