jquery - 选中下一个兄弟 td 的复选框时如何将表格单元格设置为一个值

Question

这是我的代码：

 ...
    <td class="paymentStatus">@Model.paymentStatus</td>
    <td><input type="checkbox" class="checkbox"/></td>
 </tr>

我想要做的是，当复选框被选中时，将 paymentStatus td 文本设置为“Payment Checked”

我试过这个：

$(".checkbox").change(function () {
    if ($(this).is(":checked")) {

        $(this).closest('.paymentStatus').text("Payment Checked");
    }
});

不工作。有谁知道为什么以及如何解决？

Answer 1

您需要使用closest获取其父级td，然后sibling(td.paymentStatus)设置文本。

演示

$(".checkbox").change(function () {
    if ($(this).is(":checked")) {
          $(this).closest('td')
          .siblings('td.paymentStatus')
          .text("Payment Checked");
    }
});

Answer 2

您必须向上移动一个级别，然后选择上一个兄弟：

$(this)
    .parent()
    .prev('.paymentStatus')
    .text('Payment checked');