我在 chrome 中遇到了 jquery 的append() 函数的问题。
我正在处理浏览器聊天,并通过长轮询从服务器检索聊天消息。 当客户端收到新消息时,该消息会附加到特定的聊天实例 div 中。
在附加之后,我想滚动设置scrollTop,即“滚动到聊天 session 文本的底部”。 这在大多数浏览器中都可以正常工作,但在 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()函数进行某种回调?
谢谢。
最佳答案
似乎 scrollHeight
在 Chome 上并没有得到很好的支持(例如 http://code.google.com/p/chromium/issues/detail?id=34224 ),并且我发现append()是异步的声明不受支持。也许控制台打开的事实会改变整个页面的行为(不同的高度)?
我建议您使用 jQuery 提供的函数,而不是直接访问属性,http://api.jquery.com/height/对于 setter/getter 和 http://api.jquery.com/scrollTop/对于设置者。
关于javascript - jquery 在 chrome 中追加,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11033727/