setTimeout 与多个项目

Question

我尝试在多个 li 项目上设置 setTimeout 函数，这些项目再次具有 ul 和 li。幻灯片动画效果很好，但我想在再次关闭 slideUp 之前有一个延迟。但它不起作用。幻灯片下降但不会再次上升。我认为这是因为我必须为每个 li ul（索引）都有一个索引 setTimeout 函数。但我不知道如何让它工作。谁能指出我正确的方向？谢谢！

var menu = $('#menu').find('li').has('ul'); 
var timer;
menu.on('mouseenter', function(){
  clearTimeout(timer);
  $(this).find('>ul').stop().slideDown();                       
});

menu.on('mouseleave', function(){
  clearTimeout(timer);
  timer = setTimeout(function() {
    $(this).find('>ul').stop().slideUp();
  },1000);
});

Answer 1

问题是你有多个列表，它们会抵消打开的列表。您需要为每个 li 分配超时，或者您需要查看它们是否是另一个打开的 li 以关闭它。

var lis = $('#menu').find('li').has('ul');

lis.on('mouseenter', function(){
    var li = $(this);
    var timer = li.data("timer");    
    clearTimeout(timer);
    $(this).find('>ul').stop().slideDown();                         
});

lis.on('mouseleave', function(){
    var li = $(this);
    var timer = setTimeout(function() {
            $(this).find('>ul').stop().slideUp();
        },1000);
    li.data("timer", timer);
});

setTimeout 与多个项目

setTimeout with multiple items

javascript

jquery

timer