jquery在chrome中追加答案

【问题标题】：jquery append in chromejquery在chrome中追加
【发布时间】：2012-06-14 13:08:12
【问题描述】：

我在 chrome 中使用 jquery 的 append() 函数有问题。

我正在处理浏览器聊天，并正在从服务器检索带有长轮询的聊天消息。当客户端收到一条新消息时，该消息将附加到特定的聊天实例 div 中。

在追加之后，我想立即滚动设置scrollTop，即chat_session_text 的“滚动到底部”。这在大多数浏览器中都可以正常工作，但在 chrome 中却不行。经过一番研究，append() 在 chrome 中似乎不同步？

如果我在代码中记录 scrollHeight，它会显示 div 的错误高度。但是，如果我将此代码粘贴到 chrome 控制台中，它的高度是正确的！所以，我怀疑 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 });

有谁知道如何解决这个问题？ DOM 准备好后，可能会为 append() 函数提供某种回调？

谢谢。

【问题讨论】：

jsfiddle.net/dvirazulay/pD7pL/1 - 它在 chrome 中运行良好。您能否提供一个 jsfiddle 来显示它在 chrome 中的错误行为？

标签： javascript jquery google-chrome

【解决方案1】：

Chome 似乎不太支持scrollHeight（例如http://code.google.com/p/chromium/issues/detail?id=34224），并且我发现 append() 是异步的声明不受支持。也许控制台打开的事实改变了整个页面的行为（不同的高度）？

我建议你使用 jQuery 提供的函数而不是直接访问属性，http://api.jquery.com/height/ 用于 getter，http://api.jquery.com/scrollTop/ 用于设置器。

【讨论】：