使用stop（）延迟（）或超时？

$('.file a').live('mouseenter', function() { $('#download').stop(true, true).fadeIn('fast'); }).live('mouseleave', function() { $('#download').stop(true, true).fadeOut('fast'); }); 

我希望mouseenter函数有一个stop()和1秒的延迟。 因此，如果我将鼠标hover在#download则fadeIn应在1秒延迟后启动。 如果我同时将鼠标移出，则fadeIn不应该启动。 抓住我？

我真的不知道怎么做，有什么想法吗？

Answer 1

在这种情况下，您需要使用setTimeout() ，因为.delay()工作方式（以及您无法取消它）。

 $('.file a').live('mouseenter', function() { $.data(this, 'timer', setTimeout(function() { $('#download').stop(true, true).fadeIn('fast'); }, 1000)); }).live('mouseleave', function() { clearTimeout($.data(this, 'timer')); $('#download').stop(true, true).fadeOut('fast'); }); 

你可以在这里尝试一下 。

如果使用.delay()它.delay()元素的下一个动画出列， 无论您是否先清除该队列 。 因此，您需要一个可以取消的超时，上面的操作是手动调用setTimeout()并将结果存储为$.data()以便稍后通过clearTimeout()清除它。

Answer 2

我正在寻找类似问题的答案，我发现.animate（）也可以用来处理这个问题，并且它服从.stop（）

它看起来像这样：

 $('.file a').live('mouseenter', function() { $('#download') .stop(true, true) .animate({opacity:0}, 1000); // one second delay .animate({opacity:1}, 'fast', 'swing'); }).live('mouseleave', function() { $('#download') .stop(true, true) .animate({opacity:0}, 'slow', 'swing'); }); 

Answer 3

使用setTimeout函数

 $('.file a').live('mouseenter', function() { setTimeout(function(){ $('#download').stop(true, true).fadeIn('fast'); }, 1000); }).live('mouseleave', function() { $('#download').stop(true, true).fadeOut('fast'); }); 

setTimeout将在指定的毫秒之后执行函数内的代码（在本例中为1000）。

Answer 4

你可以在jquery上使用它而不使用延迟事件。

 $('.file a').hover(function() { time = setTimeout(function() { $('#download').fadeIn(); },1000); },function(){ clearTimeout(time); }); 

1000是$（’#download’）淡出后的时间。