jquery:if(target)是('.wrapper')的子项然后(做某事)

时间:2010-10-18 06:37:01

标签: javascript jquery

var target = $(this).attr("href");

if {target is child of ('.wrapper')} then (do something)

简单的语法?有人可以在这里告诉我正确的语法吗?

10 个答案:

答案 0 :(得分:72)

if($(target).parents('.wrapper').length > 0) {
   //do something...
}

答案 1 :(得分:32)

.has()可能是最方便的语法:

if( $('.wrapper').has($(target)) ) {
     // do something
}

更“强大”(就性能而言)是$.contains()。因此,理想的算法应如下所示:

var $wrapper =  $('.wrapper'),
    $target  =  $(this).attr('href');

if( $.contains($wrapper[0], $target[0]) ) {
    // do something
}

参考:.has()$.contains()

答案 2 :(得分:3)

这是一个更整洁的方法:将其绑定为jQuery插件。您可能会发现它更容易理解和使用。

   $.fn.isChildOf = function(element)
{
    return $(element).has(this).length > 0;
}

用法:

    if ( $('.target').isChildOf('.wrapper') ) {
      //do all the things.
    }

答案 3 :(得分:2)

如果孩子的深度超过一个级别,雅各布代码的变化很小。

if($(target).parents('.wrapper').length) {
   //do something...
}

答案 4 :(得分:1)

答案 5 :(得分:1)

<div class="parent">
    <div class="child">
    </div>
 </div>


$(".child").is(".parent .child")

答案 6 :(得分:0)

你不能绑定另一个事件吗?

$('.wrapper *').click(function() {
    // will execute on childrens of .wrapper
});

答案 7 :(得分:0)

我知道这是旧帖子,但它可能对某人有用。 在我看来,在许多情况下使用.closest()会有更好的性能:

if ($(target).closest('.wrapper').length){
    // your code here
}

答案 8 :(得分:0)

您可以使用jQuery的.find()方法,如下所示:

if ( $( '.wrapper' ).find( $( e.target ) ).length > 0 ) {
    // target is a child of $( '.wrapper' )
}

$( document ).on('click', function ( e ) {
    if ( $( '.wrapper' ).find( $( e.target ) ).length > 0 ) {
        // do staff here, target's inside $( '.wrapper' )
        alert( 'target is a child of .wrapper' );
    } else {
        alert( 'target is not a child of .wrapper' );
    }
} );
.wrapper {
    width: 200px;
    height: 200px;
    background: black;
    display: flex;
}
.wrapper:before {
    content: '.wrapper';
    color: #FFF;
    position: absolute;
}
.child {
    width: 80px;
    height: 80px;
    background: red;
    margin: auto;
    color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
    <div class="child">.child</div>
</div>

答案 9 :(得分:0)

您可以使用 jQuery 的 is 函数,

var target = $(this).attr("href");

if ($('a[href="'+target+'"]').is(('.wrapper > *') {
  //do soemthing
}

'.wrapper > *'.wrapper 的显式第一级子级的 css 选择。如果您需要任何嵌套的锚元素,请改用 '.wrapper *'