Jquery点击除了指定div元素其他地方,隐藏该div

<!DOCTYPE html>
<html>  

    <head>
        <meta charset="UTF-8">
        <script type="text/javascript" src="js/jquery.min.js"></script>
        <title></title>
        <script type="text/javascript">
            $(document).bind(‘click‘, function(e) {
                var e = e || window.event; //浏览器兼容性
                var elem = e.target || e.srcElement;
                while (elem) { //循环判断至跟节点,防止点击的是div子元素
                    if (elem.id && elem.id == ‘test‘) {
                        return;
                    }
                    elem = elem.parentNode;
                }
                $(‘#test‘).css(‘display‘, ‘none‘); //点击的不是div或其子元素。。这里可以更改其他的内容/*if ( $(‘#side_shop_cart‘).hasClass(‘sh-hi‘) ) {

$(‘.shop-car-sider‘).animate({left:‘35px‘,opacity:‘hide‘},‘normal‘,function(){

$(‘.shop-car-sider‘).removeClass(‘sh-hi‘);
});
}*/  

            });
        </script>
    </head>  

    <body>
        <div id="test" style="width: 300px; height: 300px; background-color: #CBC7BC;">
            div测试内容,点击其它地方会隐藏此div模块。
        </div>
    </body>  

</html>  

原文地址:https://www.cnblogs.com/wangyongx/p/8391349.html

时间: 2024-11-06 09:41:57

Jquery点击除了指定div元素其他地方,隐藏该div的相关文章

JQuery实现点击div以外的位置隐藏该div窗口

简单示例代码: <body> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $(document).bind("click&

jQuery如何过滤排除指定的元素

jQuery如何过滤排除指定的元素:在实际应用中可能会有这样的情况,jQuery选择器获取一个元素集合之后,里面可能有并不中意的,需要被排除出去,下面就通过代码实例介绍一下如何实现此功能,代码如下: $("div:not(.antzone)").length(); 以上代码可以获取class属性值不为antzone的div元素的数量,也可以使用如下方式: $("img").not(".antzone").length(); 上面就是两个简单的演示

点击页面其它地方隐藏该div的方法

思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而调用document的onclick方法隐藏了该div. <script type="text/javascript"> function stopPropagation(e) { if (e.stopPropagation) e.stopPropagation(); else

点击页面其它地方隐藏该div的两种思路

第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而调用document的onclick方法隐藏了该div. $(document).bind('click',function(){ $('#test').css('display','none'); }); $('#test').bind('click',function(e){ stopPropagati

点击页面其它地方隐藏某个div的两种思路

思路一             第一种思路分两步     第1步:对document的click事件绑定事件处理程序,使其隐藏该div     第2步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而调用document的onclick方法隐藏了该div $(document).bind('click',function(){    $('#test').hide();}); $('#test').bind('click',function(e){    

jquery点击区域显示或隐藏DIV,点击非该DIV的地方隐藏该DIV

<div class="Content_top"> <div class="Reserve"> <h3><span class="current">散租自驾</span><span>商务代驾</span><span> </span><span> </span><span> </span><

jQuery点击下拉菜单的展示与隐藏

首先点击显示某个div,然后要求再次点击时消失,或者点击document的其他地方会隐藏掉这个层,涉及到冒泡的问题,阻止document冒泡到dom上.代码如下: var $el = $(".search-more, .article-query-list li"); $el.click(function(e){ e.stopPropagation(); $(this).toggleClass('active'); }); $(document).on('click',function

Android点击EditText文本框之外任何地方隐藏键盘的解决办法

1,实现方法一:通过给当前界面布局文件的父layout设置点击事件(相当于给整个Activity设置点击事件),在事件里进行键盘隐藏 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/traceroute_rootview" android:layout_width="fill_parent" android:l

点击页面其它地方隐藏div所想到的jQuery的delegate

在网页开发的过程中经常遇到的一个需求就是点击一div内部做某些操作,而点击页面其它地方隐藏该div.比如很多导航菜单,当菜单展开的时候,就会要求点击页面其它非菜单地方,隐藏该菜单. 先从最简单的开始,假如页面有一个id为test的div,我们要实现点击页面其它地方隐藏该div: <div id="test" style="margin:100px;background-color:#3e3;width:100px;height:100px;"> <