添加類到這個元素之外的父div與jQuery

Question

我試圖針對一個元素的特定父，然後用jQuery添加一個類。例如：

$('.disable-link').click(function(e) { 
 
    $(this).hide(); 
 
    $(this).parents('.item').find('.title').addClass('disabled'); 
 
    
 
    e.preventDefault(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="item"> 
 
    <div class="title">Thing 1</div> 
 
</div> 
 
<div> 
 
    <a class="disable-link" href="#">Click to Disable Thing 1</a> 
 
</div> 
 
<div class="item"> 
 
    <div class="title">Thing 2</div> 
 
</div> 
 
<div> 
 
    <a class="disable-link" href="#">Click to Disable Thing 2</a> 
 
</div> 
 
<div class="item"> 
 
    <div class="title">Thing 3</div> 
 
</div> 
 
<div> 
 
    <a class="disable-link" href="#">Click to Disable Thing 3</a> 
 
</div>

我認爲，通過使用.parents('.item')它會去一路攀升鏈條特定item類this和目標是具體的，但由於某種原因，它不是。

我試過使用parent().parent().find('.title')，但最終將disabled類添加到所有標題，而不僅僅是一個。 我有一種感覺，它是簡單的，但我無法圍繞特定的繼承包裹我的頭。

Answer 1

與.item類的元素是不是父母.disable-link的元素，所以你應該使用.prev()方法類似瞄準父母div第一再拿到之前的.item：

$('.disable-link').click(function(e) { 
    $(this).hide(); 
    $(this).parents('div').prev('.item').find('.title').addClass('disabled'); 

    e.preventDefault(); 
}); 

希望這有助於。

$('.disable-link').click(function(e) { 
 
    e.preventDefault(); 
 
    
 
    $(this).hide(); 
 
    $(this).parents('div').prev('.item').find('.title').addClass('disabled'); 
 
});

.disabled{ 
 
    background-color: grey; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="item"> 
 
    <div class="title">Thing 1</div> 
 
</div> 
 
<div> 
 
    <a class="disable-link" href="#">Click to Disable Thing 1</a> 
 
</div> 
 
<div class="item"> 
 
    <div class="title">Thing 2</div> 
 
</div> 
 
<div> 
 
    <a class="disable-link" href="#">Click to Disable Thing 2</a> 
 
</div> 
 
<div class="item"> 
 
    <div class="title">Thing 3</div> 
 
</div> 
 
<div> 
 
    <a class="disable-link" href="#">Click to Disable Thing 3</a> 
 
</div>