javascript - 在悬停时限制 jquery 执行(次数/时间)

Question

我创建了一个菜单，它使用一些 CSS 和 jquery 在悬停时显示其子菜单。事情是，如果用户在菜单项上多次悬停，它会有点滑稽。这是网址:http://91.202.168.37/~ibi/ ，这是 jquery 代码(内部文档准备就绪):

if ($(window).width()>991) //menu script desktop or laptop
  {
  $('#mob-main-menu > li.menu-item-has-children').hover(function(event){
    event.preventDefault();
    $(this).children('a').toggleClass('bold600');
    $(this).children('a').siblings('.sub-menu').slideToggle();
  });
  }
  else // menu script touch device
  {
  $('#mob-main-menu > li.menu-item-has-children').click(function(event){
    if ($(this).children('a').siblings('.sub-menu').css('display') == 'none')
      {
        event.preventDefault();
        console.log('hidden');
      }
    $(this).children('a').toggleClass('bold600');
    $(this).children('a').siblings('.sub-menu').slideToggle();
  });
  }

我尝试使用 setTimeout() 函数，但无法正常工作。我可以限制代码排队不超过 2 次，无论它计算了多少次悬停吗？而不是在 x 时间后将其设置回零？任何其他让它更好地工作的想法都会被愉快地接受。

Answer 1

尝试使用 .stop() 函数制作动画，它会清除动画队列，因此它应该可以正常工作

$(this).children('a').siblings('.sub-menu').stop().slideToggle();