JQuery height() возвращает 0 на видимый div - почему?

У меня есть контейнер (thetext1) с установленной высотой 360 пикселей. "thetext1" содержит два divs - один слева, а один - вправо - в оба из которых содержимое передается через вызов ajax.

Бывают случаи, когда содержимое в одном или другом из этих divs превышает 360 пикселей, поэтому я хочу соответственно увеличить высоту текста.

Мой тестовый код

newhgt = $('#thetext1').find('div.rhs').css("background", "pink").height();

возвращает 0 - (мой селектор верен, так как целевой div совершенно розовый!).

Почему это? Я знаю - из ответов на предыдущие сообщения на этом сайте - что решение заключается в добавлении переполнения: hidden thetext1, но я хотел бы понять, почему моя попытка получить высоту rhs и lhs div не работает.

Ответ 1

Убедитесь, что код находится внутри $(window).load [not $(document).ready]

$(window).load(function () {
    newhgt = $('#thetext1').find('div.rhs').css("background", "pink").height();
});

Ответ 2

Вы все равно можете использовать $(document).ready, пока вы проверяете, загружен ли элемент первым. Я решил пойти с

 $("_element name/id_").load(function() {
      $(this).height();
 });

Я изначально нашел решение здесь: http://www.fortwaynewebdevelopment.com/jquery-width-or-height-always-returns-0-fix/

И решил использовать ответ в первом ответе.

Ответ 3

У меня была та же проблема, и я заметил одно: div должен быть видимым, когда вы вызываете .height();

Но, , даже если div видимый, родители этого div должны быть видимыми. Таким образом, вы должны гарантировать, что родители div видны (display!= None)

Написание a $('#div').parent().show(); сделает родителя видимым, вам могут понадобиться другие parent().show();

Ответ 4

Ваш код кажется правильным, вот рабочая демонстрация

http://jsfiddle.net/VWBrf/1/

Ответ 5

newhgt = $('#thetext1').find('div.rhs').css("background", "pink")[0].getBoundingClientRect().height;