如何将文本区域中每行的字符数限制为固定值

Question

在我的文本区域,我应该每行只能输入72个字符.如果我使用cols属性设置为72,则根据字符宽度允许更多或更少的字符数.

任何人都可以帮忙怎么做？

Answer 1

每行重复的Textarea限制字符Jquery或Javascript

<TEXTAREA NAME="HARD" COLS="72" ROWS="5" WRAP="HARD">

Answer 2

我遇到了同样的问题，并尝试使用JavaScript解决它。为什么不只接受Juan Mendes建议的HTML代码？

好吧，这很简单：它实际上并不能跨浏览器运行，或者至少在Ubuntu 25下不能使用Firefox 25，每行的最大字符数似乎受文本区域宽度的限制，具体取决于我可以输入+ -1的字体大小信件。但是无论文本区域的宽度如何，我都希望每行的字符数限制为特定值。所以我想出了这段代码：

var maxLength = 3;
$('#mytext').on('input focus keydown keyup', function() {
    var text = $(this).val();
    var lines = text.split(/(\r\n|\n|\r)/gm); 
    for (var i = 0; i < lines.length; i++) {
        if (lines[i].length > maxLength) {
            lines[i] = lines[i].substring(0, maxLength);
        }
    }
    $(this).val(lines.join(''));
});

我还准备了一个jsFiddle。我希望这可以帮助别人 ：）

最后，简要说明了这段代码的工作原理：

• 该函数等待以下事件之一：输入，焦点，键按下，键输入（使用这么多事件可能看起来有点不必要，但是我进行了很多测试，以找到可以跨浏览器使用并且始终触发的组合，无论是否只有单个输入字母，连续按下键或将文本粘贴到textarea中）
• 它获得了textarea的价值
• 然后将每个换行符处的textarea拆分为一个新的array元素
• for循环在此数组上进行迭代，并检查数组的每一行（分别是否超过了预先设置的maxLength）
• 如果一行超过了maxLength，则在maxLength个字符后“截断”该行
• 最后，当没有剩余的行长超过maxLength个字符时，将数组元素再次连接到一个字符串中

编辑：我现在发现的唯一限制是，当在开头或行内输入其他字符时，代码“切断”字符串的末尾，而不是在字符已添加的地方。在大多数情况下，这无关紧要，但请记住：)无论如何，适当地更改此功能应该不太困难，但是在大多数情况下，这将浪费资源;）

Answer 3

您可以在表单提交（onsubmit）或文本字段的按键或其他任何地方调用它

if (document.yourformname.textareaname.value.length > maxchars) {
 // too many
}

编辑：这是JavaScript。您当然还需要验证服务器端。