ausblenden alle Zeilen nach einer bestimmten Zeile

Question

ich eine ASP.NET MVC-Anwendung mit C# bin Entwicklung, .NET Framework 4.7 und jQuery 3.1.1.

Ich habe eine Ansicht mit einem Tisch:

<table id="myTable"> 
<tbody> 
    <tr> ... </tr> 
    <tr> ... </tr> 
    <tr> ... </tr> 
    <tr id="row_x"> ... </tr> 
    <tr> ... </tr> 
    <tr> ... </tr> 
    <tr> ... </tr> 
    ... 

Ich möchte <tr id="row_x"> ... </tr> alle Zeilen unter der Zeile verstecken, aber ich weiß nicht, wie die Zeilen zuzugreifen. Muss ich allen eine ID geben?

Ich habe gedacht, sie mit einem <div> zu umgeben, aber ich glaube nicht, dass es eine gute Idee, oder möglich ist.

Answer 1

können Sie die Methode jQuery nextAll()

$("#row_x").nextAll().hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="myTable"> 
 
    <tbody> 
 
    <tr> 
 
     <td>Row 1</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 2</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 3</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 4</td> 
 
    </tr> 
 
    <tr id="row_x"> 
 
     <td>Row 5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 6</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 7</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 8</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 9</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

$("#row_x").nextAll('tr').hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="myTable"> 
 
    <tbody> 
 
    <tr> 
 
     <td>Row 1</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 2</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 3</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 4</td> 
 
    </tr> 
 
    <tr id="row_x"> 
 
     <td>Row 5</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 6</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 7</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 8</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Row 9</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

versuchen Genau wie diese

$('#row_x').nextAll('tr').hide();