javascript - 将文本区域符号限制为可见部分

Question

有什么方法可以将文本区域输入的符号限制为仅可见部分吗？

我不想滚动，我已经为其指定了行数列，并且我希望用户不能输入太多可能出现滚动的字符。

当然我可以设置溢出:隐藏，但无论如何都会输入符号。限制字符数不是我的情况，因为不同的字符采用不同的宽度:例如 W 和 1。我需要这个逻辑，因为在文本区域中输入的数据用于某些打印报告，并且不可能在纸张中滚动。

我只找到了两种可能的解决方案:

1. 使用一些平均数 人物。并以此限制 数字。这是非常粗糙的。因为 对于平均数量为 大字比平时更大呢 仍会隐藏一些数据。

2. 使用输入的渲染 字符到一些单独的 div 和 计算它的宽度/高度。似乎 我会很慢而且不会 确保这是正确的实现。

Answer 1

您可以使用 JavaScript 检查 scrollHeight，如果大于“原始”高度，则 chop 文本，直到不再有滚动。代码如下:

function CheckScroll(oTextarea) {
    if (oTextarea.scrollHeight > oTextarea.offsetHeight) {
        while (oTextarea.scrollHeight > oTextarea.offsetHeight) {
            oTextarea.value = oTextarea.value.substr(0, oTextarea.value.length - 1);
         }
    }
}

并触发它:

<textarea cols="15" rows="3" onkeyup="CheckScroll(this);" onchange="CheckScroll(this);" onpaste="CheckScroll(this);"></textarea>

实时测试用例:http://jsfiddle.net/yahavbr/bNqVf/1/