使用Chrome和Firefox中的换行符对textarea进行不同的maxlength验证

Question

问题在于Firefox将换行设为“1”（\ n）字符，而Chrome将其视为“2”（\ r \ n） 这是我在textarea maxlength=10中获得的内容：

这是 Firefox

的 10 字符

1234
5
6
7

这是 Chrome

的 10 字符

1234
5
6

尝试验证表单时出现问题。如果我有以下文字

012345
678

在 Firefox 中，验证通过并保存数据，但当我尝试在 Chrome 中执行相同操作时，它会显示警告，并阻止其发送表单。 “请将此文本缩短为10个字符或更少（您目前使用11个字符）”。

我认为此验证消息是Chrome中的新消息，或者至少我之前没有看到它们

这是JSFiddle example。要在 Chrome 中重现它，您应该编写一个包含10个字符的字符串，然后删除1并按Enter键添加新行。

以下是JavaScript如何计算JSFiddle length count with js的示例。

不知道哪一行是新行（1或2）的正确值。但由于数据库（在我的情况下是Postgres）和JavaScript认为它是“1”字符，我想知道是否有办法让 Chrome 来做相同。

Answer 1

我没有找到任何解决办法让maxlength属性在所有浏览器中以相同的方式工作，我认为是因为它相对较新。所以我决定去javascript。

谷歌搜索了一下我发现这个jQuery Max Length插件很有效，只需添加几行。可以在 MIT许可下找到。并按原样计算换行符（2个字符）

它有一些参数可以设置最大长度，反馈文本，背景变化，充满时，等等。该网站有很好的文档和很多例子。

它具有高度可定制性，例如这里是我的

这是我使用的唯一代码加上一些css。

<script type="text/javascript" src="jquery.plugin.js"></script>
<script type="text/javascript" src="jquery.maxlength.js"></script>
<script>
    $(function() {
        $('.t_tresc').maxlength({
            showFeedback: true,
            feedbackText: '{c} / {m} max.', 
            overflowText: '{c} / {m} max!', 
            feedbackTarget: '#targetFeedback$name',
            max: $max_length,
            truncate: false,
            onFull: null
        }); 
    });
</script>