jQuery点击页面其他任意地方关闭弹框

来源:互联网 发布:超基因优化液txt下载 编辑:程序博客网 时间:2024/06/05 22:38
<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="utf8">
        <title>
            测试弹框
        </title>
        <script src="./jquery-1.8.3.min.js"></script>
    </head>
    
    <body>
        <div class="click">点击</div>
        <div class="show" style="border:1px solid blue;width:200px;display:none;">展示区</div>
    </body>
    <script type="text/javascript">
        $(".click").click(function(e){
            if($(".show").hasClass("allhide")){
                $(".show").hide();
                $(".show").removeClass("allhide");
                return;
            }
            e.stopPropagation();
            $(".show").show();
            $(".show").addClass("allhide");
        });
        $(document).click(function(){
            if($(".show").hasClass("allhide")){
                $(".show").hide();
                $(".show").removeClass("allhide")
            }
        });
    </script>

</html>


可直接测试

0 0
原创粉丝点击