Как определить scrollHeight?


96

Как определить scrollHeight подразделения с использованием css overflow: auto?

Я пытался:

$('test').scrollHeight();
$('test').height(); but that just returns the size of the div not all the content

В конце концов, я пытаюсь создать чат и всегда иметь полосу прокрутки до текущего сообщения на экране.

Итак, я подумал примерно следующее:

var test = $('test').height();
$('test').scrollTop(test);

Спасибо,

Брайан


Что не так с использованием scrollHeight ()?
— Бадр Хари

2
@BadrHari: В scrollHeight()jQuery нет функции.
— TJ Crowder,

это $ ('test'). get (0) .scrollHeight ();
— JFouad

Ответы:


91

scrollHeight - это обычное свойство javascript, поэтому вам не нужен jQuery.

var test = document.getElementById("foo").scrollHeight;

Благодарность! У меня это сработало: var height = document.getElementById ("chatLog"). ScrollHeight - $ ('# chatLog'). Height (); $ ('# chatLog'). scrollTop (высота);
— Брайан

6
А как насчет поддержки браузером? Все основные версии браузеров это поддерживают? IE8 +?
— SexyBeast

2
@Cupidvogel На связанной странице MDN написано IE8 +
— Деннис

320

Правильные способы в jQuery -

  • $('#test').prop('scrollHeight') ИЛИ
  • $('#test')[0].scrollHeight ИЛИ
  • $('#test').get(0).scrollHeight

16
+1 за $ ('# test') [0] .scrollHeight, учитывая, что запрашивающий уже использовал jQuery.
— Джексон

12
Это должен быть принятый ответ, поскольку он отвечает на вопрос.
— invot

Это должен быть принятый ответ. Обратите внимание, что для этого propметода требуется jquery версии 1.6 или выше. +1 от меня
— Вейн

2
Обратите внимание, что это возвращает только scrollHeight «первого» найденного элемента, и если какие-либо элементы в настоящее время «скрыты», вы можете получить здесь ноль, даже если у других есть положительный scrollHeight, FWIW :)
— rogerdpack

@rogerdpack Хороший вопрос, сэр! Хотя в этом примере он использует идентификатор вместо класса в качестве селектора, поэтому с ним все в порядке, но, тем не менее, это хороший аргумент.
— dave4jr
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.