jquery选择指定元素之外的所有元素

本文转载自查看原文 2016-12-23 15:03 1899 js

最近的项目中有这么一个需求，点击一排图片中的任意一张后底部弹出一个对话框，要求点击任意地方隐藏对话框

这个时候用not()显然是不现实的，用closest()可以实现差不多的功能

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>选择指定元素外的其他所有元素</title>
        <style>
            *{
                margin: 0;
                padding: 0;
            }
            .box{
                border: 1px solid red;
                overflow: hidden;
            }
            .box > div{
                height: 100px;
                width: 100px;
                background-color: cadetblue;
                float: left;
                margin-left: 10px;
            }
            .box > div > div{
                height: 50px;
                width: 50px;
                background-color: coral;
            }
        </style>
    </head>
    <body>
        <div class="box">
            <div class="num1">
                <div></div>
            </div>
            <div class="num2">
                <div></div>
            </div>
            <div class="num3">
                <div></div>
            </div>
        </div>
        <script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
        <script>
            $(document).click(function(e){
                if( $(e.target).closest('.num2').length == 0 ){
                    alert("事件触发");
                }
            });
        </script>
    </body>
</html>

关键知识点：jquery closest()

closest():在DOM树中从当前元素开始向上寻找（包括当前元素），并用匹配元素构建一个新的jquery对象

参考：http://www.w3school.com.cn/jquery/traversing_closest.asp

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 jQuery移除指定元素后的所有元素 [ jquery 选择器 :gt(index) ] 此方法选取匹配大于指定索引值的所有元素 jquery点击元素之外触发事件 JS/jQuery点击某元素之外触发事件 [jQuery]点击某元素之外触发事件 JQuery元素选择 JQuery选择兄弟元素 jquery选择器选择除当前点击元素外所有的元素 jquery定位到指定元素 jquery属性选择器（匹配具有指定属性的元素）