jquery - jquery - 鼠标悬停和单击关闭？

Question

我有一个通过单击激活的下拉菜单 - 没问题。当您将鼠标移出时，它会关闭 - 没问题。我还希望它在您单击菜单项时关闭 - 问题。

当您单击关闭时，它会关闭，但是一旦您移动鼠标，它就会重新切换隐藏类，可能与 mouseout 发生冲突。

我对 jquery 很陌生，请解释清楚。

'visuallyhidden' 类只是可见性：隐藏。

$body.on('click', 'a.user', function(e){
      $('ul.user-links').toggleClass('visuallyhidden');
  });

  $body.on('click', 'ul.user-links', function(e){
      $('.user-links').toggleClass('visuallyhidden');
  });

  $body.on('mouseout', 'ul.user-links', function(e) {
      if($(e.toElement).parents('ul.user-links').length < 1) {
        $('ul.user-links').toggleClass('visuallyhidden');
      }
  });

Answer 1

嗯，我猜这个问题是由你使用的事实引起的toggleClass()；当你click菜单声音它实际上toggleClass()，但当你mouseout()再次toggleClass()。尝试对mouseoutlike应用控件

if($('ul.userl-links').hasClass('visuallyhidden')){
 ..
}
 else { }

使用addClass()andremoveClass()而不是toggleClass() If you make a fiddle, 我会编辑问题以更好地回答。