点击下拉菜单如何实现？

类似于本站用户登录后，登录名后箭头那样：
鼠标点击弹出，再次点击关闭；这个能实现
鼠标点击弹出，点击页面其它地方，菜单关闭；这个怎么实现

初步设想是在页面上注册点击事件，判断显示后关闭，不知各位有什么更好的实现没有。

---

一段示例，我把下拉菜单定义了个.dropdown的类

if($(".dropdown").length!=0){
    $(".dropdown").each(function(e){
        var dropdown_menu = $(this).find('.dropdown_menu');
        $(this).click(function(){
            dropdown_menu.slideToggle();
        });

        $(document).mouseup(function(e) {
            if (dropdown_menu.is(":visible") && $(e.target).parents('.dropdown').length == 0) {
                dropdown_menu.slideUp();
            }
        });
    });
}

我还是补上HTML结构吧

<div class="dropdown">
    <span>下拉菜单</span>
    <ul class="dropdown_menu">
        <li></li>
        <li></li>
        <li></li>
    </div>
</div>

CSS就不用了吧，自己发挥想象力

---

最简单的方法是用一个$(html)的click事件，但是要在很多地方写阻止冒泡的代码比较麻烦

有个技巧就是$(html).one();

只会运行一次就解绑

---

在页面上注册点击事件，判断事件源，如果不是弹出菜单并且菜单处于open状态则关闭。
在实现弹窗的非弹窗区域点击时关闭弹窗也是这样的处理思路。