javascript - 简单的 jquery 点击事件脚本，它是一个循环

Question

我有一个简单的 jQuery 脚本。这是脚本：

var menu = $('#nav .menu');

$('li', menu).mouseenter(function() {
    $(this).find('.sub-menu').slideDown();
}).mouseleave(function(){
    $(this).find('.sub-menu').slideUp();
});

此脚本打开一个子菜单。但我对这个脚本有疑问。如果你快速过一遍。脚本每次启动。当您快速检查该项目时。菜单打开了很多次。我怎样才能解决这个问题？

感谢帮助

Answer 1

使用 jQuery 的.stop()函数。传递必要的论点，例如。.stop(true,true),.stop(true)

$('li', menu).mouseenter(function() {
    $(this).find('.sub-menu').stop().slideDown();
}).mouseleave(function(){
    $(this).find('.sub-menu').stop().slideUp();
});

或将其作为上下文传递对我来说似乎更整洁-它与 .find() 做同样的事情

$('li', menu).mouseenter(function() {
    $('.sub-menu',this).stop().slideDown();
}).mouseleave(function(){
    $('.sub-menu',this).stop().slideUp();
});

Answer 2

使用这种方式：

$('#nav .menu li').hover(function() {
   $('.submenu').stop().slideDown();
}, function(){
   $('.submenu').stop().slideUp();
});