Динамическая ширина таблицы по столбцу - PullRequest
Новая
       18

Динамическая ширина таблицы по столбцу

0 голосов
/ 03 августа 2009

У меня есть одна таблица, в которой отображаются данные из динамического содержимого, я хочу сделать таблицу ширина 100% , когда есть 6 столбцов. и таблица ширина авто если меньше 5 столбцов.

Я пробовал с CSS, но, когда есть только два столбца, он расширяется на два столбца до полной ширины, в то время как таблица имеет ширину 100% и выглядит неудобно.

Есть ли какой-нибудь Javascript, jQuery-скрипт для получения этого результата?

Ответы [ 2 ]

1 голос
/ 03 августа 2009

Использование jQuery и обеспечение выбора первой строки в теле таблицы в случае, если thead имеет другой макет. 

function setTableWidth(tableId) {

    var $tbl = $('#'+tableId);
    var newWidth = $tbl.find('tbody>tr:eq(0)>td').length > 5 ? '100%' : 'auto';
    $tbl.width(newWidth)

 }
1 голос
/ 03 августа 2009

В зависимости от того, как вы загружаете динамический контент, может быть более простой способ, но эта функция должна делать то, что вам нужно: 

function setTableWidth(tableId) {
    myTable = document.getElementById('tableId');
    if (myTable.getElementsByTagName('tr')[0].getElementsByTagName('td').length > 5)
        myTable.style.width = '100%';
    else
        myTable.style.width = 'auto';
 }

Обратите внимание, что он не будет работать, если у какой-либо из ячеек в первом ряду есть кольспан. Это просто подсчет количества столбцов в первой строке и установка ширины на основе этого.

...