为什么 closest(） 选择器在这种情况下不起作用

Why won't the closest() selector work in this instance?

本文关键字：这种情况下 不起作用 选择器 closest 为什么      更新时间：2023-09-26

我正在尝试在单击单选按钮时激活特定图像上的 toggleClass((。多年来我一直在努力让它工作，但不能。我可以设法选择单选按钮的父元素，但没有进行任何操作。我已经尝试了next((，nextAll((和closest((。所有这些似乎都不符合我想要实现的目标。

这是我的jQuery函数：

$(document).ready(function() {
  $("input[type=radio]").change(function () {
    if (this.value == "AM") {
      $(this).closest('img[title="am"]').toggleClass('houdini');
    } else if (this.value == "PM") {
    alert('PM');
/*      Something here */
    } else {
        return false();
    }
  });
});

和我的 HTML：

<tr>
    <td><input type="radio" name="bisley" value="AM" />AM<input type="radio" name="bisley" value="PM" />PM<span class="compname">Bisley</span></td>
    <td>Fit more into less space</td>
    <td class="time"><img src="/images/generic/openday/tick.png" alt="tick" title="am" class="houdini" />10.00AM</td>
    <td class="time"><img src="/images/generic/openday/tick.png" alt="tick" title="pm" class="houdini" />1.30PM</td>
</tr>

closest搜索祖先元素; next和nextAll搜索同级元素。所需的img元素是同级元素的子元素，因此需要更复杂的语句。 试一试：

$(this).closest('tr').find('img[title="am"]').toggleClass('houdini');

这说"找到最接近的祖先tr元素，然后在其中找到img[title="am"]。

更改为

$(this).parent().children('img[title="am"]').toggleClass('houdini');

查看演示

相关文章：