jQuery: найдите следующий флажок и отключите его

Question

У меня есть несколько checkbox элементов, и я хочу отключить следующий (или предыдущий).

Мой код выглядит так:

<td>
  <input type="checkbox" class="chkOk" />
</td>

<td>
  <input type="checkbox" class="chkNotOk" />
</td>

<!-- Futher checkboxes -->

Я пытался:

$(function () {
    $('input[type=checkbox]').bind("click", function () {
        $(this).next('input[type=checkbox]').attr("disabled");
    });
});

А также:

$(this).siblings('input[type=checkbox]').attr("disabled");

Но это не работает.Пожалуйста, помогите.

Answer 1

Вам нужно подойти к родителю td и найти оттуда следующий флажок:

var n = $(this).parent().nextAll().has(":checkbox").first().find(":checkbox");

Получает td с использованием parent, затем получает всех следующих братьев и сестер (nextAll) из этого td, уменьшает соответствующий набор только до тех td элементов, которые содержат флажок (has) и затем получают первый (first) в оставшемся наборе.

Обратите внимание, что disabled является свойством, и вы должны использовать prop для его установки, а не attr:

n.prop("disabled", true);

Проблема, с которой вы столкнулись, заключается в том, что вы ищете одноуровневых флажков, и в вашем примере HTML у них нет одноуровневых элементов.