jquery - 单击下拉菜单

Question

我的下拉菜单一团糟。有人可以帮忙吗。单击其他元素(菜单)时，我无法隐藏下拉菜单。当显示下拉菜单时，主菜单的悬停也不会停留。

$('.menus >li').on('click', '> a' ,function() {
    $(this).siblings('.main-subs').show();      
}).on('click', function(){  
    $(this).siblings('.main-subs').hide();      
});

演示见here

Answer 1

在鼠标悬停时隐藏类名 main-subs 的所有其他子菜单

$('.menus >li').on('click', '> a' ,function() {
  $('.main-subs').hide();   
  $(this).siblings('.main-subs').show();    
})

$('.menus >li').on('mouseover', '> a' ,function() {
  $('.main-subs').hide();   
})

fiddle :http://jsfiddle.net/tintucraju/c5ebqaje/1/