仅将代码应用于 JQuery 中单击元素的父级

Question

如何仅将代码应用于 JQuery 中所选元素的父级而不是所有元素？

HTML

<div class="box">

    <div class="box-li">
        <div class="hide"></div>
        <div class="click">click</div>
    </div>

    <div class="box-li">
        <div class="hide"></div>
        <div class="click">click</div>
    </div>

</div>

查询

$('.box-li .click').click(function(){
    $('.box-li .hide').fadeOut();
});

Answer 1

你可以使用.parent()从一个元素到它的父元素。 为此，您还需要使用this上下文 - 每个回调都将this分配给它当前是目标的元素。 您可以将它包装在一个 jQuery 对象$(this) ，然后遍历到父对象：

 $('.box-li .click').click(function(){ $(this).parent().fadeOut(); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="box"> <div class="box-li"> <div class="hide"></div> <div class="click">click</div> </div> <div class="box-li"> <div class="hide"></div> <div class="click">click</div> </div> </div>