单击链接jquery时如何显示下拉菜单

Question

我知道如何在任何链接上捕获点击事件。这是我的代码

<a id="piclink_1" class="picLinks">...</a>

$('a.picLinks').click(function() {
    //split at the '_' and take the second offset
    var picNumber = $(this).attr('id').split('_')[1]; 
    viewer.show(picNumber);
});

我想显示一个下拉菜单，当我点击链接时，该菜单会在链接下方显示两个子菜单。如果我点击下拉菜单链接的外面，然后向下滚动菜单将隐藏。请指导我如何实现这一点。感谢

我的标记看起来像

<a id="link">About</a>

<div id="submenu">
     <a href="#">About the company</a><br />
     <a href="#">Careers</a>
</div>

Answer 1

试试这个

   $('a.picLinks').click(function() {
    $('#submenu').show();    
 });

 var mouseIn = false;   

    $('a.picLinks').click(function() {

     $('#submenu').hover(function(){ 
        mouseIn =true; 
    }, function(){ 
        mouseIn =false; 
    });

    $("body").mouseup(function(){ 
        if( mouseIn == false)
         $('#submenu').hide();
    });

});