在JQuery事件中查找父元素

时间:2012-08-30 15:22:09

标签: javascript jquery

我添加了一个点击事件,如下所示,并希望检查目标是否具有特定的父级。

$(document).click(function(event){
    // Check here if target has specific parent for example -> #parent
});

如何做到这一点?

4 个答案:

答案 0 :(得分:16)

这有一个.parent() dom遍历方法。

根据Pointy的水晶球,你可能想做这样的事情:

$(document).click(function(event) {
  if ($(event.target).parents('.selector').length > 0) {
  }
});

我不确定你为什么要在文档上设置点击处理程序,也许正在寻找事件委托和.on()

答案 1 :(得分:3)

我相信这也有效.AFAIK jQuery事件在调用事件时使用文字元素而不是jQuery对象。基本上this应该是具有普通JavaScript属性的普通DOM元素。

$(document).click(function(event)
{
   myparent = $(this.parentNode); //jquery obj
   parent = $(this.parentNode)[0]; //plain DOM obj

   myself = $(this); //jquery obj;
   $elf = this; //plain DOM obj
});

注意:有时使用' self'因为变量是坏/导致与某些库冲突所以我使用$ elf。 $ elf中的$并不特殊,就像jQuery约定或任何东西。

答案 2 :(得分:2)

$(document).click(function(event){
    var $parent = $(this).parent();

     // test parent examples 
    if($parent.hasClass('someclass')) { // do something }

    if($parent.prop('id') == 'someid')) { // do something }

    // or checking if this is a decendant of any parent

    var $closest = $(this).closest('someclass');

    if($closest.length > 0 ) { // do something }

    $closest = $(this).closest('#someid'); 

    if($closest.length > 0 ) { // do something }
});

答案 3 :(得分:2)

我过去已经可靠地使用了它:

var target = $( event.target )

这将为您提供对调用事件的元素的jQuery对象的引用。您可以使用相同的方法查看父级是否为“#parent”,如下所示:

var target = $( event.target )
if (target.parent().attr('id') == "#parent") {
    //do something
}