点击所有地方时,下拉菜单关闭

时间:2015-01-22 02:09:34

标签: javascript jquery html drop-down-menu

我的下拉菜单中有以下脚本:

<script type="text/javascript">

jQuery(window).load(function() {
    $("#nav > li > a").click(function () { // binding onclick
        if ($(this).parent().hasClass('selected')) {
            $("#nav .selected div div").slideUp(100); // hiding popups
            $("#nav .selected").removeClass("selected");
        } else {
            $("#nav .selected div div").slideUp(100); // hiding popups
            $("#nav .selected").removeClass("selected");

            if ($(this).next(".subs").length) {
                $(this).parent().addClass("selected"); // display popup
                $(this).next(".subs").children().slideDown(200);
            }
        }
    }); 
});
</script>

HTML

<div class="menu">
<span>
    <ul id="nav">
        <li><a href="#">Produk Teknik <i class='icons icon-right-dir'></i></a>
            <div class="subs">
                <div class="wrp3">
                    <ul>
                        <li><h3>Manometer</h3>
                            <ul>
                               <li><a href='#'>tes</a>
                                    <ul>
                                        <li><a href='#' class='anak'>tes-1</a></li>
                                    </ul>
                                </li>
                                <li><br /></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </li>
    </ul>
</span>

我需要更改该脚本,以便当我们点击所有位置时,下拉菜单将自动关闭。谢谢

您可以看到我的项目示例http://www.tokobesi.co.id/beta/

1 个答案:

答案 0 :(得分:1)

我认为这就是你的意思伙伴。试试这个......:)

$(document).click(function(e){
    if( $(e.target).closest(".menu").length > 0 ) {
        return false;
    }else{
        $("#nav .selected").removeClass("selected");
    }
});