JQuery добавить текст (по всей ширине таблицы) ниже строки при нажатии

Я хочу добавить очень большой текст ниже строки, когда была нажата строка, так что ширина будет шириной всей строки. Теперь это только ниже первого столбца строки.

HTML:

<table id="accordion">
<tbody><tr> <td>Jill</td> <td>Smith</td> <td>50</td>
</tr>
<tr> <td>Eve</td> <td>Jackson</td> <td>94</td>
</tr>
<tr> <td>Jill</td> <td>Smith</td> <td>50</td>
</tr> </tbody></table>

JavaScript:

5 ответов

Может, что-то вроде этого? Я просто использовал colspan

$("tr").on("click", function(e) { $(this).after("<p>SOME very very very very very very very very very very long text!</p>");
});
<table id="accordion"> <tbody><tr> <td>Jill</td> <td>Smith</td> <td>50</td> </tr> <tr> <td>Eve</td> <td>Jackson</td> <td>94</td> </tr> <tr> <td>Jill</td> <td>Smith</td> <td>50</td> </tr>
</tbody></table>


Вы можете создать еще одну строку и установить ее colspan равным 3


Должен работать, но чем больше текста вы добавляете, тем больше ширина будет добавлено в таблицу, растягивая столбцы.


Вам нужно создать элементы для добавления в таблицу. Чтобы занять 100% таблицы, вам нужно использовать colspan

$("tr").on("click", function(e) { $(this).after($('').html($('').html('A very long text'))); });


Попробуй это

licensed under cc by-sa 3.0 with attribution.