jQuery - find first sibling matches selector

qyuhtwio  于 2023-06-22  发布在  jQuery
关注(0)|答案(3)|浏览(133)

我怎样才能得到列表中第一个(下一个)匹配选择器的元素?
示例:

<table>
  <tr class="test"><td>not this one</td></tr>
  <tr><td><a title="test">click</a></td></tr>
  <tr><td>not this one</td></tr>
  <tr class="test"><td>this one</td></tr>
  <tr class="test"><td>ignore this as well</td></tr>
</table>

$("a").on('click', function(eve){
  $(this).parents("tr").???(".test").toggle();
});

编辑
我需要下一排。兄弟姐妹也会得到其他人(如第一排)

6qfn3psc

6qfn3psc1#

使用.nextAll()获取元素的后续兄弟元素,使用:first获取第一个匹配的元素。
试试这个:

$("a").on('click', function(eve){
  $(this).parents("tr").nextAll(".test:first").toggle();
});

DEMO

stszievb

stszievb2#

你可以尝试使用jQuery eq();
给定一个表示一组DOM元素的jQuery对象,.eq()方法从该组中的一个元素构造一个新的jQuery对象。提供的索引标识此元素在集合中的位置。Documentation on jQuery

<table>
  <tr class="test"><td>not this one</td></tr>
  <tr><td><a title="test">click</a></td></tr>
  <tr><td>not this one</td></tr>
  <tr class="test"><td>this one</td></tr>
  <tr class="test"><td>ignore this as well</td></tr>
</table>

代码将选择2º兄弟,其类为“test”,< tr >是点击的父节点之一 < a >(红色这个反过来,你得到了你的代码):

$("a").on('click', function(){
  $(this).parents("tr").siblings(".test").eq(1).toggle();
});

Check the Pen!

pkln4tw6

pkln4tw63#

您可以使用.next()选择器:
Description: Get the immediately following sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next sibling only if it matches that selector.
对于您的情况,请使用
$(this).parents("tr").next().next()

$(this).closest("tr").next().next()

相关问题