添加類同級上點擊嵌套元素

上我與DOM的操作的問題。我想在.fonts-container li上單擊添加類到.text元素。添加類同級上點擊嵌套元素

<div class="editor"> 
    <h2 class="text">Heading</h2> 
    <div class="ui-resizable-handle"></div> 
    <div class="ui-resizable-handle"></div> 
    <div class="ui-resizable-handle"></div> 
    <img class="icon-layer-up2" > 
    <img class="icon-layer-down2"> 
    <img class="icon-trash2"> 
    <i class="icon-move"></i> 
    <i class="font2"></i> 
    <div class="fonts-container"> 
     <ul> 
      <li data-fontname="Aclonica">Aclonica</li> 
      <li data-fontname="Acme">Acme</li> 
      <li data-fontname="Alegreya">Alegreya</li> 
     </ul> 
    </div> 
</div>

這裏是我的車JS：

$(document).on('click', '.fonts-container ul li', function(){ 
    if ($('.font2').hasClass("active")) { 
     var fontName = $(this).data("fontname"); 
     $(this).prev().parent(".editor").find('.text').addClass("fontset"); 
    } 
});

來源

2013-10-18 lipenco

使用closest

$(document).on('click', '.fonts-container ul li', function(){ 
    if ($('.font2').hasClass("active")) { 
     var fontName = $(this).data("fontname"); 
     $(this).closest(".editor").find('.text').addClass("fontset"); 
    } 
});

來源

2013-10-18 06:38:18

使用父母

$(document).on('click', '.fonts-container ul li', function(){ 
    if ($('.font2').hasClass("active")) {alert('a'); 
     var fontName = $(this).data("fontname"); 
     $(this).parents(".editor").find('.text').addClass("fontset"); 
    } 
});

來源

2013-10-18 06:43:01

你只是想找一個家長，不是所有可能的父母。 –

使用父母

$('li'.'.fonts-container').on('click', function(){ 
if ($('.font2').hasClass("active")) { 
    var fontName = $(this).data("fontname"); 
    $(this).parents(".editor").find('.text').addClass("fontset"); 
} 
});

來源

2013-10-18 06:45:03

你只尋找一位父母，而不是所有可能的父母。 –

，直到使用.closest()達到.fonts-container你可以走了樹，然後找到使用.siblings()同級節點：

$(this).closest('.fonts-container').siblings('.text')

來源

2013-10-18 06:57:31

添加類同級上點擊嵌套元素

回答

相關問題