ExtJS，无法将我的文本区域滚动到底部

Posted 2023-05-07

【中文标题】ExtJS，无法将我的文本区域滚动到底部

【英文标题】：ExtJS, can't scroll my textarea to its bottom

【发布时间】：2012-05-21 20:24:44

【问题描述】：

我正在使用 extjs 4 并且我有一个 textarea 可以在其中插入一些文本，滚动条默认设置在顶部，因此当文本超过 textarea 高度时它会溢出。我希望我的 textarea 滚动条默认设置在它的底部，所以当我插入新文本时它会立即显示，而无需手动向下滚动滚动条。

textarea 代码是这样的：

items: [
    xtype: 'textareafield',
    id: 'textarea1',
    autoScroll: true,
    resizable: true,
    name: 'textarea1',
    autorender: true,
    fieldLabel: 'textarea1',
    value: '...'
    ,

我用

插入新文本

area.setValue(Ext.getCmp('textarea1').getValue()+'\n'+message);

但我找不到任何自动向下滚动的方法。我已经搜索了文档和谷歌，现在几乎每个人都使用 gwt，但我不能。有没有办法仅使用 extjs 方法来实现相同的目标？在 gwt 中，他们使用像 .setScrollTop() 这样的方法，但在 extjs 中没有类似的方法，我找不到它..

非常感谢您提供的任何帮助！

【问题讨论】：

见this question

【参考方案1】：

您可以保存区域文本的旧字符串长度，然后使用selectText() 使光标移动到正确的位置。

area.selectText(oldStringLength, oldStringLength);

selectText(start, end) 实际上并非针对此目的，但仍然可以使用。

【讨论】：

Errata corige，它不工作..好吧，不是到处都是：它在 firefox 上工作得很好，同一个页面加载了 chromium（ubuntu 的谷歌浏览器）不，滚动条卡在顶部和你必须手动移动它。知道为什么会这样吗？一直以为extjs自己处理跨浏览器兼容性..

刚刚发现 Chrome 的情况。你可以试试this solution

@powder 'Errata corige' 是什么意思

【参考方案2】：

var d = area.getEl().down('textarea').dom; 
d.scrollTop = d.scrollHeight - d.offsetHeight;