[问]关于DIV中内容的自动滚动……

sinzy 2003-04-14 02:59:18
我在一个div中显示不断增加的字符,并给div的overflow属性赋值auto。因为字符是通过divID.innerHTML加入的,内容多了以后,div就显示滚动条,我希望滚动条能自动的保持滚动到最底部,使得新出现的字符(显示在最底部)总能可见。

查了MSDN,找到了一个doScroll方法,似乎是唯一支持div的滚动条的方法,但是它能滚动的最大距离就是一个pageDown的距离,如果字符相当多,也会影响效果。

不知道有没有别的函数能实现我需要的效果。

谢谢!

我目前的主要代码是
...
function ShowMsg()
{
theDiv.innerHTML += GetMessage(); // GetMessage()函数产生一些字符。
theDiv.doScroll("scrollbarPageDown"); // 我所发现的最大滚动距离
}
...
<div id="theDiv" style="width: 100%; height: 200px; overflow: auto;"></div>
...全文
366 点赞 收藏 9
写回复
9 条回复
切换为时间正序
请发表友善的回复…
发表回复
JK_10000 2003-04-14
theDiv.scrollTop=theDiv.scrollHeight

-----------------
也可以用
theDiv.scrollTop=1000000
回复
JK_10000 2003-04-14
我在innerHTML += GetMessage()之后立刻用theDiv.scrollTop = theDiv.scrollHeight,它的刷新似乎不及时,表现滚动条没有滚到底部,除非我等待1秒之后再用这句……

--------------------
用innerHTML的话,整个DIV里的HTML都会由IE重新解释一遍,所以会很费时。
事实上楼主的要求只是不停的往后面加东西,所以用.insertAdjacentHTML效率会得到改善,因为IE并不需只重新解释DIV里的所有内容,而只需要解释新加的内容即可。
代码如下,当加入的是一个marquee时,用.insertAdjacentHTML与用innerHTML效果会有明显不同。



<script>
function ShowMsg()
{
theDiv.insertAdjacentHTML("BeforeEnd","<br>"+document.all.helloText .value);
//theDiv.innerHTML += "<br>"+document.all.helloText .value;
theDiv.doScroll("scrollbarPageDown");
}
</script>
<div id="theDiv" style="width: 100%; height: 200px; overflow: auto;"></div>
<input name=helloText value="<marquee>fdsafdsa</marquee>"><input type=submit value=ok onclick="ShowMsg()">
回复
x_coolboy 2003-04-14
你的GetMessage()如果可以返回TR的话,给每TR 一个 ID
然后document.all("rowID").scrollIntoView(true);
rowID是你自己设的,就可以了
回复
sinzy 2003-04-14
好的!以后还请多指教!:)
回复
心云意水 2003-04-14
也许是处理innerHTML需要时间??
稍等一秒钟嘛!
回复
sinzy 2003-04-14
非常感谢 xinyunyishui(心云意水) ,It works!但是似乎还有一点问题。我在innerHTML += GetMessage()之后立刻用theDiv.scrollTop = theDiv.scrollHeight,它的刷新似乎不及时,表现滚动条没有滚到底部,除非我等待1秒之后再用这句……
回复
心云意水 2003-04-14
theDiv.scrollTop=theDiv.scrollHeight
回复
sinzy 2003-04-14
不错,我的这个很类似聊天室。典型的聊天室显示聊天记录的要么是Window本身,要么是iframe,这两个对象的滚动有不少方法,比如scrollTo(),scrollBy(),scroll()。常见的写法是:....window.scroll(0, 65000) - 给一个足够大的滚动值。

我用的是div,不支持上面的方法,且我觉得,要是用给极大值的方法,我把那个doScroll()循环几次就行了,可是这样子比较没意思。这个不是项目,希望能做的精致些,呵呵。
回复
随风奔跑 2003-04-14
关注学习。
我不懂。
不少的聊天室的代码的功能应该就是这样的。
能不能找个聊天室的代码看看?
回复
发动态
发帖子
JavaScript
创建于2007-09-28

8.4w+

社区成员

Web 开发 JavaScript
申请成为版主
社区公告
暂无公告