Изменение высоты строки таблицы

Question

Я пытаюсь изменить высоту строки таблицы, принадлежащей определенному классу, на 0.

В настоящее время я делаю это:

$("#table_rolecart tbody").append('<tr class='hide'><td>Start Date: <input type="text" value="" id="ar_startdate"></td><td>End Date: <input type="text" value="" id="ar_enddate"></td></tr>');
$('.hide').height = "0"

Это все еще не ноль, как мне установить высоту на 0 или установить стиль отображения на ноль для этих <tr> s?

Answer 1

Используйте функцию css:

$('.hide').css('height', '0');

Если вы хотите удалить их из поля зрения, вы также можете установить display: none:

$('.hide').css('display', 'none');

Вы также можете удалить их полностью:

$('.hide').remove();

Если вам не нужно скрывать их динамически, вы должны просто использовать CSS:

.hide {
    height: 0;
    /* or display: none */
}

Answer 2

Любой из этих методов установит высоту строки в 0:

$(".hide").height(0);
$(".hide").css("height", 0);

Но таблицы сложны, и установка высоты в 0 не приведет к скрытию строки.Самый простой способ скрыть строку - использовать любой из этих методов:

$(".hide").hide();
$(".hide").css("display", "none");

Но, если вы хотите скрыть строку, используя высоту (по любой причине), также установите line-height в 0.Затем в дочерних ячейках установите padding в 0 (и, возможно, также border) и установите overflow в hidden.

$(".hide").css({
    height: 0,
    lineHeight: 0
});
$(".hide > *").css({
    padding: 0,
    overflow: "hidden"
});

Но в вашем случае даже этоне будет работать, потому что элементы управления вводом все еще отображаются.Вам нужно будет обернуть содержимое ячейки в контейнер, такой как div, и скрыть это.

Answer 3

Высота - это свойство css, поэтому вы можете установить его с помощью функции css

$('.hide').css("height", "0");

Обратите внимание, что вы также можете скрыть его с помощью

$('.hide').css("display", "none");

Answer 4

Попробуйте это: $('.hide').height(0);