From 48ab9a136d603e99cfbdfa07da4791f9ed569ec8 Mon Sep 17 00:00:00 2001 From: sight <1453017105@qq.com> Date: Wed, 13 Dec 2023 18:56:36 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E5=A2=9E=E5=BC=BA=20dropdown=20delay=20?= =?UTF-8?q?=E9=80=89=E9=A1=B9=EF=BC=8C=E6=94=AF=E6=8C=81=E8=AE=BE=E7=BD=AE?= =?UTF-8?q?=20`=E6=98=BE=E7=A4=BA/=E9=9A=90=E8=97=8F`=20=E7=9A=84=E5=BB=B6?= =?UTF-8?q?=E8=BF=9F=E6=97=B6=E9=97=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit close https://gitee.com/layui/layui/issues/I8NZ8X --- docs/dropdown/detail/options.md | 6 ++++-- src/modules/dropdown.js | 22 ++++++++++++++++++---- 2 files changed, 22 insertions(+), 6 deletions(-) diff --git a/docs/dropdown/detail/options.md b/docs/dropdown/detail/options.md index 6aa5b415..c66f4106 100644 --- a/docs/dropdown/detail/options.md +++ b/docs/dropdown/detail/options.md @@ -142,11 +142,13 @@ 延迟关闭的毫秒数。当 `trigger: 'hover'` 时才生效 +2.9.2+ 延时显示或隐藏的毫秒数，[showDelay, hideDelay]。若为 number 类型，则表示显示和隐藏的延迟时间相同，例如 300 或者 [200, 300]。当 `trigger: 'hover'` 时才生效 + -number +number/array -`300` +`[200, 300]` diff --git a/src/modules/dropdown.js b/src/modules/dropdown.js index 374959cd..ed0fefcd 100644 --- a/src/modules/dropdown.js +++ b/src/modules/dropdown.js @@ -101,7 +101,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ isAllowSpread: true, // 是否允许菜单组展开收缩 isSpreadItem: true, // 是否初始展开子菜单 data: [], // 菜单数据结构 - delay: 300, // 延迟关闭的毫秒数，若 trigger 为 hover 时才生效 + delay: [200, 300], // 延时显示或隐藏的毫秒数，若为 number 类型，则表示显示和隐藏的延迟时间相同，trigger 为 hover 时才生效 shade: 0, // 遮罩 accordion: false // 手风琴效果，仅菜单组生效。基础菜单需要在容器上追加 'lay-accordion' 属性。 }; @@ -388,6 +388,17 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ } lay('.' + STR_ELEM_SHADE).remove(); }; + + Class.prototype.normalizedDelay = function(){ + var that = this; + var options = that.config; + var delay = [].concat(options.delay); + + return { + show: delay[0], + hide: delay[1] !== undefined ? delay[1] : delay[0] + } + } // 延迟删除视图 Class.prototype.delayRemove = function(){ @@ -397,7 +408,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ thisModule.timer = setTimeout(function(){ that.remove(); - }, options.delay); + }, that.normalizedDelay().hide); }; // 事件 @@ -416,7 +427,10 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ that.prevElemCallback = function(e){ clearTimeout(thisModule.timer); that.e = e; - that.render(); + thisModule.timer = setTimeout(function(){ + that.render(); + }, that.normalizedDelay().show); + e.preventDefault(); }; @@ -425,7 +439,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ // 如果是鼠标移入事件 if(options.trigger === 'mouseenter'){ - // 直行鼠标移出事件 + // 执行鼠标移出事件 options.elem.on('mouseleave', function(){ that.delayRemove(); }); From f4c99817d9ef64b9c3849d50e8616ebe56e75871 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B4=A4=E5=BF=83?= <3277200+sentsim@users.noreply.github.com> Date: Wed, 13 Dec 2023 23:05:47 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E5=AE=8C=E5=96=84=20dropdown=20=E7=9A=84?= =?UTF-8?q?=20`delay`=20=E9=80=89=E9=A1=B9=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/dropdown/detail/options.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/dropdown/detail/options.md b/docs/dropdown/detail/options.md index c66f4106..4f533019 100644 --- a/docs/dropdown/detail/options.md +++ b/docs/dropdown/detail/options.md @@ -140,9 +140,10 @@ delay -延迟关闭的毫秒数。当 `trigger: 'hover'` 时才生效 +延迟触发的毫秒数。当 `trigger: 'hover'` 时才生效。示例： -2.9.2+ 延时显示或隐藏的毫秒数，[showDelay, hideDelay]。若为 number 类型，则表示显示和隐藏的延迟时间相同，例如 300 或者 [200, 300]。当 `trigger: 'hover'` 时才生效 +- `delay: 300` : 表示显示与隐藏的延迟时间均为 300 毫秒 +- `delay: [200, 300]` 2.9.2+ : 数组成员值分别表示显示延迟时间和隐藏延迟时间 number/array From 85da00866070dd6060b09598779f638d096498de Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B4=A4=E5=BF=83?= <3277200+sentsim@users.noreply.github.com> Date: Wed, 13 Dec 2023 23:09:15 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E4=BC=98=E5=8C=96=20dropdown=20=E6=A0=B9?= =?UTF-8?q?=E6=8D=AE=E8=A7=A6=E5=8F=91=E7=9A=84=E4=BA=8B=E4=BB=B6=E7=B1=BB?= =?UTF-8?q?=E5=9E=8B=E8=BF=9B=E8=A1=8C=E5=BB=B6=E8=BF=9F=E6=B8=B2=E6=9F=93?= =?UTF-8?q?=20=E8=8B=A5=E4=B8=BA=E9=BC=A0=E6=A0=87=E7=A7=BB=E5=85=A5?= =?UTF-8?q?=E4=BA=8B=E4=BB=B6=EF=BC=8C=E5=88=99=E5=BB=B6=E8=BF=9F=E6=98=BE?= =?UTF-8?q?=E7=A4=BA=EF=BC=9B=E5=85=B6=E4=BB=96=E4=BA=8B=E4=BB=B6=E6=AD=A3?= =?UTF-8?q?=E5=B8=B8=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/modules/dropdown.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/modules/dropdown.js b/src/modules/dropdown.js index ed0fefcd..4af95785 100644 --- a/src/modules/dropdown.js +++ b/src/modules/dropdown.js @@ -421,15 +421,22 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ // 解除上一个事件 if(that.prevElem) that.prevElem.off(options.trigger, that.prevElemCallback); + + // 是否鼠标移入时触发 + var isMouseEnter = options.trigger === 'mouseenter'; // 记录被绑定的元素及回调 that.prevElem = options.elem; that.prevElemCallback = function(e){ clearTimeout(thisModule.timer); that.e = e; - thisModule.timer = setTimeout(function(){ - that.render(); - }, that.normalizedDelay().show); + + // 若为鼠标移入事件，则延迟触发 + isMouseEnter ? ( + thisModule.timer = setTimeout(function(){ + that.render(); + }, that.normalizedDelay().show) + ) : that.render(); e.preventDefault(); }; @@ -438,7 +445,7 @@ layui.define(['jquery', 'laytpl', 'lay', 'util'], function(exports){ options.elem.on(options.trigger, that.prevElemCallback); // 如果是鼠标移入事件 - if(options.trigger === 'mouseenter'){ + if (isMouseEnter) { // 执行鼠标移出事件 options.elem.on('mouseleave', function(){ that.delayRemove();