我想要点击一个DIV之外的任何地方,都能隐藏这个DIV要怎么弄?

$(".bus_select").click(function(){$(".left").toggle();$(".bus_select").hide();});点击bu... $(".bus_select").click(function(){
$(".left").toggle();
$(".bus_select").hide();
});
点击bus_select之后 left出现 bus_select隐藏 我想要点击left之外的任何地方 让left隐藏 bus_select出现
要怎么弄个?麻烦写一下,菜鸟不是很懂
展开
 我来答
很多游戏
高粉答主

2019-09-26 · 游戏精通者,攻略技能点满
很多游戏
采纳数:91 获赞数:386980

向TA提问 私信TA
展开全部

1、首先输入代码:

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>无标题文档</title>

    <style type="text/css">

        #pop {

            border: #000;

            background-color: #CCC;

            position: absolute;

            left: 50px;

            top: 50px;

            width: 200px;

2、然后输入代码:

 height: 500px;

            display: none;

        }


        #btn {

            color: #f00;

        }

    </style>

</head>

<body>

    <span id="btn">打开层</span>

    <div>aaaaaaaaaaaa</div>

    <div>aaaaaaaaaaaa</div>


3、然后输入:

<div id="pop">

        浮层,点击这个浮层以外的区域,都可以隐藏这个浮层

        <p><a href="javascript:;">最主要的是点这个div里面的链接,div照样不隐藏</a></p>

    </div>

</body>

</html>

<script type="text/javascript">

    function $(id) { return document.getElementById(id); }

    window.onload = function () {

        document.onclick = function (e) {

            $("pop").style.display = "none";

        }

        $("btn").onclick = function (e) {

4、最后输入:

$("pop").style.display = "block";

            e = e || event; stopFunc(e);

        }

        $("pop").onclick = function (e) {

            e = e || event; stopFunc(e);

        }

    }

    function stopFunc(e) {

        e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true;

    }

</script>

dksnear
推荐于2017-10-02 · TA获得超过1211个赞
知道小有建树答主
回答量:399
采纳率:0%
帮助的人:620万
展开全部
// 点击任何地方  让left隐藏 bus_select出现
$(document).click(function(){   $('.left').hide(); $('.bus_select').show();   });
// 点击left 阻拦(让left隐藏 bus_select出现)(stopPropagation阻拦click事件冒泡) 及实现了 点击left之外的任何地方  让left隐藏 bus_select出现
$('.left').click(function(event){  event.stopPropagation();  });
// 点击bus_select之后 left出现  bus_select隐藏
$('.bus_select').click(function(event){ $('.bus_select').hide(); $('.left').show();  });
追问
这个不行啊 大神,我先要点击bus_select 让left出现  然后bus_select隐藏了 ,之后点其他地方left隐藏
bus_select出现

大神发的这个 我点都点不开了。。
追答

我疏忽了 最后一个改成这样

$('.bus_select').click(function(event){ 
       $('.bus_select').hide();
       $('.left').show(); 
       event.stopPropagation();
 });
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
虎爷可乐
2015-04-13 · TA获得超过253个赞
知道小有建树答主
回答量:238
采纳率:66%
帮助的人:142万
展开全部
$(".left").toggle();
$("body").click(function(e){
if(!$(e.target).parents(".left").length){
$(".left").hide()
}
});
更多追问追答
追问
这个不行啊  用了之后根本打不开left了
追答

好吧。是我的错,我写完整吧:


//这是你的代码
$(".bus_select").click(function () {
$(".left").toggle();
$(".bus_select").hide();
});

//这是我加的代码
$("body").click(function (e) {
if (!$(e.target).closest(".left").length) {
$(".left").hide()
}
});

我没有测试过,我讲讲我的原理吧,也许你懂了原理就能自己改了。

你要的是在点 .left 以外的地方能隐藏它,那么在外面点,其实都相当于是在 body 上面点(有元素的 click 返回 false 的例外,会让 body 的 click 收不到),那么我们只要在 body 上绑定 click 就可以了,但是呢,我们在 .left 上点也会上传到 body 的 click,这时,我们要判断 我们点的元素是在 .left 里的还是 .left 外。e.target 代表我们点击的元素。 closest 方法是判断 e.target 本身和父辈元素中,有没有 .left 元素,也就是判断我们是不是在 .left 内点击了。

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友c64e97d
2015-04-13
知道答主
回答量:34
采纳率:0%
帮助的人:9.3万
展开全部
jQuery 事件 - blur() 方法
追问
能写详细点吗
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式