2

当用户单击页面中的任意位置而不是 div 时，我想隐藏 div。

<head>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function () {
    $(document).not('.me').click(function () {
        $('.me').hide()
    })
})
</script>
</head>
<body>
<div class="me" style="width:200px; height:200px; background:#F00">
test
</div>
</body>
4

5 回答 5

2 
$(document).click(function (e)
{
    var container = $(".me");

    if (container.has(e.target).length === 0)
    {
        container.hide();
    }
});
于 2013-05-30T09:51:33.333 回答
2

您可以向bodyorhtml元素添加点击事件，并防止点击事件在您的div元素上传播：

$(function () {
    //bye bye lovely div :)
    $('html, body').click(function(){
       $('.me').hide();
    });

    //let's avoid the click propagation to the body or html
    $('.me').click(function(e){
        e.stopPropagation();
     });
});

活生生的例子

于 2013-05-30T09:53:17.980 回答
2

你可以使用stopPropagation()：

$(function(){
    $(document).click(function(){
       $(".me").hide();
    });
    $(".me").click(function(e){
       e.stopPropagation(); 
    });
});

检查这个jsFiddle

于 2013-05-30T09:53:51.327 回答
1

您可以使用以下脚本来实现这一点..

 <script type="text/javascript">
        $(document).click(function (event) {
            var target = $(event.target);
            if (!target.parents().andSelf().is('.me')) {
                $(".me").hide();
            }
        });
 </script>

上面的语法是检查，如果父级不是 d​​iv( here it's me)，而不是只隐藏 div。

快乐编码:)

于 2013-05-30T10:18:58.183 回答
0 
$(function(){
    $(document).click(function(){
        $('.me').hide()
    })
    $('.me').click(function(){
        return false;
    })
})
于 2013-05-30T09:51:55.560 回答