多项setTimeout

Question

我尝试在包含ul和li的多个li项上设置一个setTimeout函数。幻灯片动画工作良好，但我希望在关闭slideUp之前有一个延迟。但这不管用。滑梯下降了，但没有再上升了。我认为这是因为我必须对每个li (索引)都有一个索引的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

问题是你有多个lis，它们会抵消那些打开的。您需要将超时时间分配给每个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);
});