找到給定類型的最接近的jQuery兄弟

#getIt將始終是#clicked的兄弟，但是，#getIt並不真正具有id屬性，並且只包含一個用於此帖子好處的屬性。找到給定類型的最接近的jQuery兄弟

從#clicked開始，選擇#getIt最簡潔的方法是什麼？我確信我可以使用兩個next()或parent()和children()這樣做，但是，可能有一種方法可用。

<div> 
    <table><table> 
    <button id="clicked">click</button > 
    <p>bla</p> 
    <table id="getIt" class="myTable" data-id="123"></table> 
    <p>bla</p> 
</div>

來源

2016-07-31 user1032531

你爲什麼在這個問題使用'id'，如果你真的沒有一個？它使問題變得混亂，因爲顯然通過'id'查找元素可以使用'$（'＃getIt'）'完成。爲什麼不在示例中使用類myTable？ – trincot

@trincot我使用了'id'，這樣我就可以解釋我正在談論的元素。 – user1032531

如果您需要使用您指定的選擇最接近的下一個元素，那麼使用nextAll。爲了得到最近的所有匹配的下一個元素，添加:first僞類選擇：

$('#clicked').click(function() { 
 
    $nearTable = $(this).nextAll('.myTable:first'); 
 
    $nearTable.css({ background: '#f00' }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <table class="myTable" data-id="123"> 
 
     <tr><td>before</td></tr> 
 
    </table> 
 
    <button id="clicked">click</button > 
 
    <p>bla</p> 
 
    <table class="myTable" data-id="123"> 
 
     <tr><td>color me</td></tr> 
 
    </table> 
 
    <p>bla</p> 
 
    <table class="myTable" data-id="123"> 
 
     <tr><td>last</td></tr> 
 
    </table> 
 
</div>

來源

2016-07-31 14:15:30 trincot

謝謝trincot。許多方法來剝皮這隻貓！你喜歡這個解決方案比jibe的更多嗎？ – user1032531

他們是不同的。正如你在你的問題中寫的*「從＃開始」*我以爲你想要的是最近的*後面的*點擊按鈕。 '兄弟姐妹'會給你所有孩子的匹配，也包括那些在按鈕之前的匹配，從父母的第一個匹配的孩子開始，而不考慮與被點擊的按鈕的接近程度。這就是爲什麼我在我的代碼片段中的按鈕前後添加了一些類似的表格，所以你會看到不同之處。 – trincot

同意。謝謝 – user1032531

您可以使用siblings：

$('#clicked').siblings('table.myTable')

來源

2016-07-31 14:05:28 jibe

啊，我認爲這是我想要的，但它可能應該是'$（'＃cliked'）。兄弟姐妹（'table'）' – user1032531

如上所述，'＃getIt'並沒有真正的'id'屬性。「兄弟姐妹（）」完全符合我的要求，但是，「應該」指出，我只有一個點擊元素後的第一個匹配項。 '兄弟姐妹'可以用嗎？ – user1032531

$（'＃cliked'）。siblings（'table.myTable'）'完美。謝謝！ – user1032531

找到給定類型的最接近的jQuery兄弟

回答

相關問題