使用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类添加到所有标题中，而不仅仅是一个。{1}}类。 我觉得它很简单，但我不能围绕特定的继承。

Answer 1

类.item的元素不是.disable-link元素的父元素，因此您应首先定位父div，然后使用{{1}获取之前的.item方法如：

.prev()

希望这有帮助。

$('.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;
}