Как контролировать ширину ячейки таблицы при вставке поля INPUT с помощью JQuery - PullRequest
Новая
       10

Как контролировать ширину ячейки таблицы при вставке поля INPUT с помощью JQuery

0 голосов
/ 21 апреля 2011

У меня есть функция редактирования на месте на веб-странице, предназначенной для веб-набора.HTML-код является тривиальным.

Я прикрепляю обработчик кликов к каждой ячейке с помощью jQuery: 

$("table td").click(editMe);

function editMe(e) {
  var w = $(this).width();  // returns cell width
  $(this).html("<span>Foo</span");  // does not change table width
  $(this).html('<input type="text" />');  // CAUSES CELL width to BLOW UP! (gets VERY wide)

  var in = $('<input type="text" />');
  in.width(w-10);
  $(this).html(in);    // CAUSES CELL WIDTH TO BLOW UP!  (nearly doubles)
}

Никаких настроек ширины не имеет значенияУ ввода нет отступов, полей, границ.Ширина ячейки таблицы просто идет беркерком.Основное внимание уделяется Webkit (Safari / Adobe AIR).Но ПОЧЕМУ?

Как сделать так, чтобы входные размеры соответствовали ячейке таблицы, в которую она вставляется?

1 Ответ

0 голосов
/ 22 апреля 2011

Хорошо, я не получил точного ответа, но оказалось, что виновник лежит в файле reset.css 960Grid CSS Framework.Я не знаю точно, какой параметр вызвал странное поведение, но удаление этого файла исправило его.

960Grid - простая CSS Framework, с которой мне нравится работать, но что-то в их файле reset.css вызвало взрыв моих таблицвверх.Как только я удалил этот файл, таблицы вели себя как положено.

...