Я хочу развернуть и свернуть таблицы таблицы при щелчке столбцов заголовка. Я просто хочу развернуть/свернуть строки, которые находятся под конкретным заголовком (щелкнуть).
Вот моя структура таблицы:
<table border="0">
<tr>
<td colspan="2">Header</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td colspan="2">Header</td>
</tr>
<tr>
<td>date</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
</tr>
</table>
Любые мысли о том, как я могу выполнить эту задачу. Использование div эта задача кажется довольно простой, но у меня есть табличные данные, которые я хочу манипулировать.
Одна из идей, которую я могу придумать, - использовать класс css в каждой строке, которая различает строки под каждым заголовком и использует JQuery для расширения/сглаживания этих строк только при нажатии на заголовок. Но если мой стол имеет 10-15 заголовков, тогда, кажется, сложно отслеживать классы css.
Пожалуйста, предложите подходящий способ достижения этого.