码迷,mamicode.com
首页 > 其他好文 > 详细

页面设置弹窗,点击其他区域,弹窗关闭

时间:2018-10-29 11:13:44      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:pre   down   src   one   btn   col   title   parent   font   

页面设置弹窗,点击其他区域,弹窗关闭(案列)

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>test</title>
    <script src="plugins/jquery-2.0.0.min.js"></script>
    <script>
        $(function(){
            $(#btn).click(function(){
                $(#box).css(display,block);
            });

            $(document).on(mousedown,function(e){
                if(!$(e.target).is($(#btn)) && !$(e.target).is($(#box)) && $(e.target).parent(#box).length === 0){
                    $(#box).css(display,none);
                }
            });
        });
    </script>

</head>
<body>
<button id="btn">显示</button>
<div style="display:none; width:200px; height:200px; " id="box">
    <div>内层的文字</div>
</div>
</body>

</html>

 

页面设置弹窗,点击其他区域,弹窗关闭

标签:pre   down   src   one   btn   col   title   parent   font   

原文地址:https://www.cnblogs.com/fanmiaolan/p/9869256.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!