如果父元素包含元素，则将类添加到元素

如果父元素（class =“container”）包含元素（class =“sub”），则必须在其单元上添加一个类（h2）在里面）。 fiddle link 如果父元素包含元素，则将类添加到元素

$('.container h2').click(function(){ 
//alert('hi'); 
if($(this).has(".sub-cat")){ 
    $('.container h2').addClass(highlight); 
} 
else if() { 
    $('.container h2').removeClass(highlight); 
}

}）;

来源

2012-11-05 matthewb

当你使用点击然后this referce你点击的H2，使用.parent()（或.closest（ '容器'），然后使用你的样子了：

http://jsfiddle.net/gSCQ7/7/

var highlight = "highlight"; 

$('.container h2').click(function(){ 
    var hasSubCategorys = $(this).parent().find(".sub-cat").length > 0; 
    $(this)[hasSubCategorys ? 'addClass' : 'removeClass'](highlight); 
});

，或者如果你想让它更易读：

var highlight = "highlight"; 

$('.container h2').click(function(){ 
    var hasSubCategorys = $(this).parent().find(".sub-cat").length > 0; 
    if(hasSubCategorys) { 
     $(this).addClass(highlight); 
    } else { 
     $(this).removeClass(highlight); 
    } 
});

编辑：http://jsfiddle.net/gSCQ7/10/改变CSS代码更具体然后.container h2 VS .hightlight

来源

2012-11-05 11:29:26 voigtan

标题（h2）在您的链接中重复两次。请参考h2 – matthewb

上的类（.highlight）属性来添加是的，它只是表明如果你有一个没有.sub-cat的容器，那么它不会为h2元素添加一个高亮类。如果它不是你想要的，那么请解释你想要你的代码做什么。因为你当前的代码缺少变量'highlight'。 – voigtan

是的，我得到了你的观点，感谢很多完美的答案。 – matthewb

尝试

if($(this).parent().find(".sub-cat").length > 0) { 
    ... 
}

或

if($(this).closest(".container").find(".sub-cat").length > 0) { 
    ... 
}

来源

2012-11-05 11:28:24 V1tOr

$('.container h2').click(function(){ 
    if ($(this).closest('.container').find('.sub-cat').length) { 
     $(this).addClass('highlight'); 
    } else { 
     $(this).removeClass('highlight'); 
    } 
});

当点击h2元素，使用closest()通过DOM树遍历并找到类“容器”的第一个父元素，然后使用find()遍历DOM向下查找具有“sub-cat”类的元素。如果找到'.sub-cat'元素（length），则向点击的h2添加“高亮”类，否则，从点击的h2中删除“高亮”类。

jQuery docs for Tree Traversal

来源

2012-11-05 11:54:44 aguynamedloren

你可以添加一些解释为什么这是答案 – dove

编辑答案包括完整的解释 – aguynamedloren

如果父元素包含元素，则将类添加到元素

回答

相关问题