当jQuery的层次结构涉及“this”选择器时,它是如何工作的?

时间:2011-10-11 05:13:30

标签: javascript jquery syntax jquery-selectors this

例如,如果我要使用此代码:

$(".Class").children(:last).click(function(){
    $(this).siblings(":not(:last)").toggle();
}

“this”会引用“.Class”类,还是会引用指定“.Class”类的最后一个子类?

4 个答案:

答案 0 :(得分:2)

this将引用在触发事件的链中的最终选择器中匹配的结果的DOM元素;在这种情况下,.Class的{​​{3}}子项。因此,如果您单击上一个last类的.Class子项,则会触发该事件。请参阅此:lastfoo2仅触发警报。

<div class="Class">
    <div> </div>
    <div> </div>
    <div> </div>
   <div> </div> <!--This is the last child of .Class-->

</div>

除非,因为:last应该在引号中作为字符串,所以它不会像你发布的那样有效。

答案 1 :(得分:2)

它将引用单击的元素。也就是说,绑定事件侦听器时元素中的最后一个元素Class。如果在事件监听器已经绑定之后在同一个父级中的前一个最后一个元素之后添加了另一个元素,它仍然会监听以前最后一个元素,而this也将是前一个。

答案 2 :(得分:0)

我认为这是那个案子中的最后一个孩子。它始终是点击单词之前匹配的最后一个元素。

答案 3 :(得分:0)

它指的是您正在操作的当前上下文。在您提供的示例中,它将引用指定的“Class”类的最后一个子项。

如果您要执行以下操作:

$(".Class").children().each(function(){
    ...
});

$(this)会在迭代过来时引用每个孩子。