jQuery兄弟/子选择器

Question

我正在寻找一种方法来选择包含包含特定图像的列的行中具有特定名称属性的所有输入。

以下代码是一个说明性示例：

＆＃13;

＆＃13;

<table>
  <tr>
    <td class="A">
      <img src="X">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
    <td class="A">
      <input type="" name="b">
      <input type="" name="b">
    </td>
  </tr>
  <tr>
    <td class="A">
      <img src="Y">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
    <td class="A">
      <input type="" name="b">
      <input type="" name="b">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;

基于上面的例子，我想知道哪个jQuery选择器可以用来选择inputs的{​​{1}}＆＃34; a＆＃34;位于name标记内的td标记内，其中包含tr标记img =＆＃34; X＆＃34 ;;

Answer 1

要执行此操作，您可以使用:has()查找包含所需图片的tr，然后按名称查找子输入，如下所示：

$('tr:has(img[src="X"]) input[name="a"]').addClass('foo');

.foo { background-color: yellow; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="A">
      <img src="X">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
    <td class="A">
      <input type="" name="b">
      <input type="" name="b">
    </td>
  </tr>

  <tr>
    <td class="A">
      <img src="Y">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
    <td class="A">
      <input type="" name="b">
      <input type="" name="b">
    </td>
    <td class="A">
      <input type="" name="a">
      <input type="" name="a">
    </td>
  </tr>
</table>