現在の行から次の "可視"兄弟を選択します。

Question

.next（）jqueryメソッドを持つ小さなセレクタが私を狂わせてしまいます。

ストーリーはそうです、私はテーブル行にjqueryでブートストラップフィルターを使用しています。 =ディスプレイを持っている現在のTRから、次の利用可能なTRを選択し、今私はjQueryのから望むすべてが何であるかを

<tr class="activated" style="display: table-row;"> 

：フィルタが実行されると、それはこのようなテーブル行に表示スタイル属性を、変更しますテーブル行。

私は次のように試してみました：

$(getSelectedRow()).next(":not(:hidden)") returns [] 

$(getSelectedRow()).next(":visible") returns[] 

$(getSelectedRow()).next("tr[display==visible]") returns [] 

私は私が次の最初の兄弟をしたいので、次回利用したいです。ここで

は）私は（あなたのgetSelectedRowを理解していないHTML

<table class="table table-hover navigateable focused" id="bookmarkTable"> 
     <thead> 
      <tr> 
       <th class="text-center">Bookmarks</th> 
      </tr> 
     </thead> 
     <tbody class="searchable" id="bookMarkResultGridView"> 
      <tr class="activated" style="display: none;"> 
       <td class="word-wrap" data-rowindex="0" data-tabid="0" 
       data-url="http://gitready.com/" style="cursor: pointer;">git 
       ready » learn git one commit at a time<br> 
       <small class= 
       "text-muted word-wrap">http://gitready.com/</small></td> 
      </tr> 
      <tr class="activated" style="display: none;"> 
       <td class="word-wrap" data-rowindex="1" data-tabid="0" 
       data-url="http://inthecheesefactory.com/blog/android-design-support-library-codelab/en" 
       style="cursor: pointer;">Codelab for Android Design Support 
       Library used in I/O Rewind Bangkok session :: The Cheese 
       Factory<br> 
       <small class= 
       "text-muted word-wrap">http://inthecheesefactory.com/blog/android-design-support-library-codelab/en</small></td> 
      </tr> 
      <tr class="activated" style="display: none;"> 
       <td class="word-wrap" data-rowindex="2" data-tabid="0" 
       data-url="https://github.com/rogerta/secrets-for-android" 
       style="cursor: pointer;">Store your all Password in Android 
       App<br> 
       <small class= 
       "text-muted word-wrap">https://github.com/rogerta/secrets-for-android</small></td> 
      </tr> 
      <tr class="activated" style="display: table-row;"> 
       <td class="word-wrap" data-rowindex="3" data-tabid="0" 
       data-url="https://guides.codepath.com/android/Google-Play-Style-Tabs-using-TabLayout#design-support-library" 
       style="cursor: pointer;">Google Play Style Tabs using TabLayout 
       | CodePath Android Cliffnotes<br> 
       <small class= 
       "text-muted word-wrap">https://guides.codepath.com/android/Google-Play-Style-Tabs-using-TabLayout#design-support-library</small></td> 
      </tr> 
     </tbody> 
    </table> 

Answer 1

ですが、それはいくつかのクラスセレクタと交換することができます（この場合、私は.selected使用）とあなただけ必要になる場合これが機能しない理由

$(".selected~tr:not(':hidden')").first(); 

https://jsfiddle.net/r3f22uzn/

が、私はわからない：これはあなたの解決策になる隠されていない最初の次の兄弟

$(getSelectedRow()).find("~tr:not(':hidden')").first(); 

が、これは動作するはずです：

$(getSelectedRow()).find("~tr:not(':hidden')").each(function(){ 
    // first element 
    $(this).css("background", "black") 
    return false; 
    }); 

https://jsfiddle.net/r3f22uzn/3/