javascript - 按属性查找最接近的元素

Question

我有这个投票片段，我想将禁用类添加到用户按下的按钮之外的其他按钮。例如，如果用户在 id 1 帖子上投票 +，则 - 按钮将获得禁用类，但 id 2 则不会。

<span class="pull-right">
              <a href="javascript:void(0)" class="vote" data-id="1" data-type="up">+</a>
              <span id="votes-1">0</span>
              <a href="javascript:void(0)" class="vote" data-id="1" data-type="down">-</a>
</span>
<span class="pull-right">
              <a href="javascript:void(0)" class="vote" data-id="2" data-type="up">+</a>
              <span id="votes-2">0</span>
              <a href="javascript:void(0)" class="vote" data-id="2" data-type="down">-</a>
</span>

我已经尝试了很多东西，比如 .closest().find() 但我无法让它工作。

Answer 1

1. 向上遍历到被点击的 .vote 元素的父元素。
2. 使用.not()和 this 排除被点击的 .vote 元素。

$('.vote').click(function() {
  var parent = $(this).parent();
  $(this).removeClass('disabled');
  parent.find('.vote').not(this).addClass('disabled');
});

.disabled {
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<span class="pull-right">
              <a href="javascript:void(0)" class="vote" data-id="1" data-type="up">+</a>
              <span id="votes-1">0</span>
<a href="javascript:void(0)" class="vote" data-id="1" data-type="down">-</a>
</span>
<span class="pull-right">
              <a href="javascript:void(0)" class="vote" data-id="2" data-type="up">+</a>
              <span id="votes-2">0</span>
<a href="javascript:void(0)" class="vote" data-id="2" data-type="down">-</a>
</span>