jquery append in chrome

Question

У меня проблема с функцией jendery app() i chrome.

Я работаю над чатом браузера и получаю чат-сообщения с длительным опросом с сервера. Когда клиент получает новое сообщение, сообщение добавляется в конкретный div экземпляра чата.

Сразу после добавления, я хочу прокрутить, установить scrollTop, то есть «прокрутить вниз» в chat_session_text. Это прекрасно работает в большинстве браузеров, но не в хроме. После некоторых исследований append() не кажется синхронным в chrome?

Если я зарегистрирую scrollHeight в своем коде, он показывает неправильную высоту для div. НО, если я вставляю этот код в хром-консоль, это правильная высота! Итак, я подозреваю, что DOM не готов с добавленным div.

Вот мой код:

var strHtmlToAppend = $('<div class="chat_message"><img class="imgThumb2" style="float:left;" src="UserImage.aspx?alias=' + fromUserID + '" border="0" alt="">' + strMsg + '</div>'); 
$('#' + elm + ' .chat_session_text').append(strHtmlToAppend); 
console.log($('#' + elm + ' .chat_session_text').prop("scrollHeight")); 
$('#' + elm + ' .chat_session_text').prop({ scrollTop: $('#' + elm + ' .chat_session_text')[0].scrollHeight }); 

Кто-нибудь знает, как решить эту проблему? возможно, какой-то обратный вызов для функции append() после того, как DOM i готов?

Спасибо.

Answer 1

Похоже, что scrollHeight не очень хорошо поддерживается на Chome (пример http://code.google.com/p/chromium/issues/detail?id=34224) и утверждение, что append() является асинхронным, я нашел неподдерживаемый. Может быть, тот факт, что консоль открыта, изменяет поведение всей страницы (разная высота)?

Я предлагаю вам использовать функции, предоставляемые jQuery, вместо прямого доступа к свойствам, http://api.jquery.com/height/ для геттера и http://api.jquery.com/scrollTop/ для сеттера.