2012-02-16 5 views
3

Я написал плагин jQuery, который, среди прочего, устанавливает ширину столбцов таблицы с помощью colgroup и позволяет изменять их размер, перетаскивая заголовки влево или вправо. Я опубликовал урезанную версию этого here. Он отлично работает в Firefox (по крайней мере, 3.6), но не работает в других браузерах, и я не знаю, почему.Динамически созданная коллега не работает

Я заметил, что когда я создаю таблицу с colgroup непосредственно в разметке, ширина будет прекрасной, но когда я добавлю их позже, используя jQuery, это не так. Может быть, я не добавляю их туда, где они должны быть, или, может быть, я неосознанно полагаюсь на устаревшее поведение, зависящее от браузера, я понятия не имею.

Изменение размеров заголовков производится путем изменения атрибута width каждого col в ответ на перетаскивание мышью. В принципе, он работает нормально, он не имеет наблюдаемых эффектов в других браузерах из-за проблемы colgroup (console.log показывает, что события запускаются правильно).

Любая помощь по этому вопросу будет оценена по достоинству. Также приветствуются предложения о том, как выполнить одно и то же без коллег. (Напомним, что заголовок изменения размера должен изменить ширину всех с.в. в колонке)

упрощенный код:

var colgroup = $('<colgroup/>'); 
table.find("td,th").each(function() { 
    create_col($(this)).appendTo(colgroup); 
}); 
colgroup.appendTo(table); 

// Inside create_col: 
var col = $('<col width="' + width + '"/>'); 
return col; 

Полный код: jsfiddle.net/mgibsonbr/YqCsY/

P.S. Хотя это не связано с проблемой, если кто-то знает также кросс-браузерный способ сделать заголовки неприемлемым, пожалуйста, скажите, что часть изменения размера будет выглядеть более «естественной» таким образом. Соответствующая строка в (полном) примере:

th.attr("unselectable","on").css("-moz-user-select","none") 

Update: По-видимому, Firefox принимает colgroup быть нижеtbody, но другие браузеры требуют, чтобы быть выше ...

// colgroup.appendTo(table); 
colgroup.prependTo(table); 

это фиксированные вещи в Chrome и Safari, Opera , но до сих пор не работает и опера.

+0

В каких браузерах это не работает? –

+0

Chrome (17), Opera (11), Safari (4). Я запускаю все их в Windows XP – mgibsonbr

ответ

2

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

// colgroup.appendTo(table); 
colgroup.prependTo(table); 

Edit: для невыбираемых проблем, нашел ответ в another question.

Смежные вопросы