javascript - 可滚动的 div 自动滚动

标签 javascript css ajax html

我的网站上有一个可滚动的 div,但由于里面的内容是 AJAX 驱动的并且每秒刷新一次...div 不断向上滚动!我该如何防止这种情况发生? 这是 div 本身:

$show = '<div class="chatlist" >';
while($row = mysql_fetch_array($sql))
    {
    $messages = $row['messages'];
    $userid = $row['id'];
    $name = $row['name'];
 $show.='
 <span class="nm" >' . $name . ':</span><br/><span class="msg">' . $messages .  '<br/></span>

 ';}
    $show.='</div>';
     echo $show;

继承人的CSS:

<style type="text/css">
    div.chatlist
    {
border: thin dotted #000;
width: 600px;
left:600px;
top:600px;
height:600px;
background-color: #000;
color: #FFF;
border-radius: 5px;
overflow: scroll;   

}
span.nm{
    font-weight: bold;
    text-align:left 
}
span.msg{
text-align: right;
font-style: italic;
 }
    </style>

两个跨度也只遵循一个 CSS 规则。有什么办法解决这个问题吗?

最佳答案

您可以使用 JavaScript 设置 DIV 的 scrollTop 属性:

https://developer.mozilla.org/en/DOM/element.scrollTop

因此您将在内容更新之前保存该值,并在更新完成后重新插入它。

关于javascript - 可滚动的 div 自动滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9627133/

相关文章:

javascript - Rx.js 与 Promise 的并发

Javascript 无法在 Firefox 上运行

css - 为什么 "overflow-x: hidden"也隐藏了overflow-y?

css - 允许用户CSS

javascript - 如何在 ajax 调用的 iframe 中加载部分 View ?

javascript - 表达式和插值标记与 Angular 嵌入表达式之间的区别

javascript - 使用 Jasmine 和 Chutzpah 对 AngularJs Controller 进行单元测试

css - 如何在CSS中设置父子之间的边界?

javascript - 如何在不刷新页面的情况下获取laravel数据?

javascript - IE 6、7、8 中的 Ajax 问题