Question

我想在下面的代码中添加一个setTimeout，以便在fadeOut效果执行之前有一个短暂的暂停。

$(document).ready(function() {  
    $('#menu li').hover(
        function() {
            $('ul', this).slideDown(50);
        }, 
        function() {
            $('ul', this).fadeOut(100);
        }
    );
});

这就是我正在尝试的，但我猜测语法一定是错的：

$(document).ready(function() {  
    $('#menu li').hover(
        function() {
            $('ul', this).slideDown(50);
        },
        function() {
            setTimeout(function() {
                $('ul,' this).fadeOut(100);
            });
        }
    );
});

对不起，如果这是一个愚蠢的问题。我是jQuery的初学者。

Answer 1

this中setTimeout()的含义不同。您需要在变量中引用所需的this或首先获取ul并引用它。

var th = this;
setTimeout(function() {
    $('ul', th).fadeOut(100);
});

或

var $ul = $('ul',this);
setTimeout(function() {
    $ul.fadeOut(100);
});

Answer 2

你可能还需要在使用clearTimeout()进行覆盖时清除超时（如果你快速进入/退出），这样的事情会起作用：

$(function() {  
  $('#menu li').hover(function() {
    clearTimeout($.data(this, 'timer'));
    $('ul', this).slideDown(50);
  }, function() {
    $.data(this, 'timer', setTimeout($.proxy(function() {
      $('ul,' this).fadeOut(100);
    }, this), 400));
  });
});

这使用$.data()存储/检索计时器ID，目前有400毫秒的延迟，只需相应调整。

将setTimeout添加到现有jQuery脚本的语法问题

2 个答案: