除指定区域外点击任何地方隐藏DIV

霸气de小男生 提交于 2020-03-16 08:58:29
<ul>
    <li><a href="#">主菜单1</a></li>
    <li><a href="#">主菜单2</a></li>
    <li class="li-other">
        <a href="javascript:;">其他<i class="arrow-down"></i></a>
        <div class="otherbox">
            <ul>
                <li><a href="#">子菜单1</a></li>
                <li><a href="#">子菜单2</a></li>
            </ul>
        </div>
    </li>
</ul>                

HTML如上:

JQuery如下:

$('.li-other').on('mousedown',function(event){
    event.stopPropagation();//阻止mousedown 事件冒泡(注意只阻止了mousedown事件)
    event.preventDefault();//阻止当前元素默认事件
    $('.li-other').toggleClass("active");
});
$(document).on('mousedown',function(){
    $('.li-other').removeClass("active");
});

 

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!