获取包含换行符的文本区域的字符数答案

【问题标题】：Get the character count of a textarea including newlines获取包含换行符的文本区域的字符数
【发布时间】：2012-10-16 22:43:22
【问题描述】：

我在 Chrome 中测试了这段代码，似乎有一个涉及换行的错误。在我真正使用所有字符之前，我已经达到了最大长度。

var ta = document.getElementById('myText');

document.getElementById('max').innerHTML = ta.maxLength;

setInterval(function() {
    document.getElementById('count').innerHTML = ta.value.length;
}, 250);

<textarea id="myText" maxlength="200" style="width:70%;height:130px">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Type more words here...
</textarea>

<div>
    Char Count <span id="count">0</span>/<span id="max">0</span>
</div>

如何准确获取文本区域的字符数？

更新 1 我向 Chromium 团队报告了 bug，它似乎是低优先级。

更新 2 该错误已合并到另一个 bug。

更新 3 该错误似乎已修复！

【问题讨论】：

滚动您自己的maxlength 属性，而不是使用浏览器的。
那么您是否要计算换行符？而不是使用setInterval 进行轮询，而是酌情使用keyup 或keypress。

标签： javascript textarea

【解决方案1】：

似乎是一个 WebKit 错误（考虑 filing 它）与将 CR/LF 对视为两个字符而不是一个字符有关。因为如果允许使用 197 个字符而不是 200 个字符通常是非关键的，因此可以忽略这一点。

但如果您愿意，您可以尝试不断保存插入符号位置，将所有\r\n 替换为\n，并在用户键入时恢复文本区域中的插入符号位置。

【讨论】：

我在 Mac OS 上的 Chrome 或 Safari 中都没有看到那个“错误”，我得到的结果与 Firefox 完全相同。某些不将换行符或换行符算作字符的文字处理器存在差异，这可能是由于它们对世界的不同看法所致。另一方面，IE 插入换行符和回车符，因此将新行计为两个字符，并且已经这样做了很长时间。
如果你的 maxlength 是 50000 并且这个计数器的最大值是 49000，这是一个大问题。
@RobG：我在 Windows 上，你呢？
IE 6 在 Windows 上进行了测试，其他版本在 Mac OS 上进行了测试。 Firefox 在 Windows 和 Mac OS 上是一致的（只插入一个新行）。
@RobG：与 Windows（换行由 2 个字符组成：CR+LF、\r\n）不同，Mac OS 上的换行由一个字符组成（回车、CR、\r），所以\r 和\n 具有相同的长度——1，并且预期该问题不会在Mac OS 上重现是合乎逻辑的。 IE6 在这里无关紧要，因为 IE10 中刚刚添加了对 HTML5 验证的支持（顺便说一句，与 Chrome 不同，它可以正常工作）。