动态滚动一个textarea [英] Dynamically Scrolling a Textarea

问题描述

我有我的网页上textarea的HTML元素被通过AJAX加载。整个textarea的每次返回不只是它的内容，和该内容随时间增长。随着textarea的我回到了下面这段的JavaScript：

I have a textarea html element on my page that gets reloaded via ajax. The whole textarea is returned each time not just its content, and the content grows over time. Along with the textarea i return the following piece of javascript:

<script type="text/javascript" >

var textArea = document.getElementById('outputTextResultsArea');
textArea.scrollTop = textArea.scrollHeight;
</script>

在Firefox 3.0.7这个地方的滚动条textarea的底部，让我看到最新的输出。然而，在IE 7，我看到不同的行为。滚动条向下移动与所述内容的意图，但一旦该含量大于textarea的高度滚动条不再向下移动。看来，如果IE浏览器记住元素，而不是新的高度的原滚动高度。

In firefox 3.0.7 this places the scroll bar at the bottom of the textArea, allowing me to see the latest of the output. However in IE 7 i see different behaviour. The scrollbar moves down with the content as intended, but once the content is greater then the textarea height the scroll bar no longer moves down. It seems as if IE is remembering the original scroll height of the element, not the new height.

我现在用的是XHTML过渡的doctype有没有什么帮助。此外，如果这可以使用jQuery来实现，这将是罚款，我有机会到这一点。

I am using the xhtml transitional doctype if that helps. Also if this can be achieved with jQuery that would be fine as I have access to that.

在此先感谢

尼尔

推荐答案

作为一个快速黑客你可以这样做：

As a quick hack you can just do this:

textArea.scrollTop = 99999;

另一种方法是尝试在一个计时器：

Another option is to try it in a timer:

setTimeout(function()
{
    var textArea = document.getElementById('outputTextResultsArea');
    textArea.scrollTop = textArea.scrollHeight;
}, 10);

这篇关于动态滚动一个textarea的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！