Развернуть/свернуть строку таблицы javascript работает неправильно

Question

Я использую этот код, чтобы развернуть строку таблицы базы данных, чтобы показать больше информации об элементе, но он делает резкое противоположное.

$("td span.expand").click(function() { 
    $(this).parents("tr.main").nextUntil("tr.main"). toggle(); 
}); 

Когда я открываю таблицу все строки, которые должны быть скрыты в настоящее время показано, и если я нажимаю на любой основной строке будет скрывать, что ряды. Как инвертировать это? Вот часть кода, который я использую для таблицы (я знаю, что это своего рода грязный)

echo '<table border="1" class="tabula"> 
<tr class="main"> 
<th width="30px"><a href="?page='.$page.'&sort=nr&sort_by='.$sort_order.'">Nr.</a></th> 
<th width="75px"><a href="?page='.$page.'&sort=numurs&sort_by='.$sort_order.'">Mašīnas numurs</a></th> 
<th width="75px"><a href="?page='.$page.'&sort=regnr&sort_by='.$sort_order.'">Reģistrācijas numurs</a></th> 
<th width="75px"><a href="?page='.$page.'&sort=modelis&sort_by='.$sort_order.'">Marka/Modelis</a></th> 
<th width="75px"><a href="?page='.$page.'&sort=apzim&sort_by='.$sort_order.'">ID</a></th> 
</tr>'; 

    //Ieraksta datus tabulā 
while($row = mysql_fetch_array($query)) 
    { 
    echo "<tr class='main'>"; 
    echo "<td width='30px'>" . $row['nr'] . "</td>"; 
    echo "<td width='75px'>" . $row['numurs'] . "</td>"; 
    echo "<td width='75px'><span class='expand'>" . $row['regnr'] . "</span></td>"; 
    echo "<td>" . $row['modelis'] . "</td>"; 
    echo "<td>" . $row['apzim'] . "</td>"; 
    echo "</tr>"; 
    echo "<tr class='hidden'>"; 
    echo "<td>text</td>"; 
    echo "<td>text</td>"; 
    echo "<td>text</td>"; 
    echo "</tr>"; 
    } 
echo "</table>"; 
echo "<br>"; 

Answer 1

Попробуйте использовать CSS в файле и включают в себя следующее:

<style> 
.expand 
{ 
display:none; 
} 
</style> 

Я использую тумблер скрипт JQuery на основе , и это то, что я использовал, когда у меня была аналогичная проблема, такая как это.

Возможно, вам потребуется использовать .hidden { display:none; }.