Javascript 如何限制文本区域中的行数

我试图限制文本区域中的行数，以确保输入的文本符合布局。每行最多可包含83个字符。 我找到了几个解决方案（），但没有一个能正常工作（到达5行a后，仍然可以输入以新行继续的大字）

因此，我收到了以下脚本，以至少限制字符数：

function sliceText(element)
{
    var maxlength =15;
    if(typeof maxlength !== 'undefined' && maxlength !== false)
    {
       var val = $(element).val();
       val = val.replace(/\r\n/g, '__NL__')
         .replace(/\n/g, '__NL__')
         .replace(/\r/g, '__NL__')
         .replace(/__NL__/g, '\r\n');

       if (val.length > maxlength)
       {
           $(element).val(val.slice(0, maxlength));
           var lastChar = $(element).val()[$(element).val().length - 1];
           if(lastChar == '\n')
           {
                $(element).val(val.slice(0, maxlength - 2));
           }
       }
    }
}

<textarea name="name" onkeyup="sliceText(this)" ></textarea>

函数切片文本（元素）
{
var maxlength=15；
if（typeof maxlength！='undefined'&&maxlength！==false）
{
var val=$（元素）.val（）；
val=val.replace（/\r\n/g，'.\uu NL'.）
.替换（/\n/g，'.\u NL'.）
.替换（/\r/g，'.\u NL'.）
.replace（/\uuuu NL\uuuu/g，“\r\n”）；
如果（值长度>最大长度）
{
$（element.val（val.slice（0，maxlength））；
var lastChar=$（element.val（）[$（element.val（）.length-1]；
如果（lastChar='\n'）
{
$（element）.val（val.slice（0，maxlength-2））；
}
}
}
}

我的想法是通过为每个换行添加“

83-（（已输入的字符数）模83）

”来扩展此功能

不幸的是，我几乎不了解

Javascript

，所以如果有人能解决这个问题，我会很高兴。

试试这个

HTML

83更多可用字符

JavaScript

<script type="text/javascript">
var maxLength=83;
function charLimit(el) {
    if (el.value.length > maxLength) return false;
    return true;
}
function characterCount(el) {
    var charCount = document.getElementById('charCount');
    if (el.value.length > maxLength) el.value = el.value.substring(0,maxLength);
    if (charCount) charCount.innerHTML = maxLength - el.value.length;
    return true;
}
</script>

var maxLength=83；
功能限制（el）{
如果（el.value.length>maxLength）返回false；
返回true；
}
函数字符计数（el）{
var charCount=document.getElementById（'charCount'）；
如果（el.value.length>maxLength）el.value=el.value.substring（0，maxLength）；
如果（charCount）charCount.innerHTML=maxLength-el.value.length；
返回true；
}

JS:

函数getLineNumber（textarea）{ 返回textarea.value.substr（0，textarea.selectionStart）.split（“\n”）.length-1； } $（函数（）{ var-chars=0； var-ln=0； var行=[]； var检查=1； $（'#ta'）.keyup（函数（e）{ lines=$（this.val（）.split（'\n'）； ln=getLineNumber（$（此）[0]）； 字符=行[ln]。长度； 检查=83个字符； $（'ct'）。文本（复选框）； }).keydown（功能（e）{ lines=$（this.val（）.split（'\n'）； ln=getLineNumber（$（此）[0]）； 字符=行[ln]。长度； 检查=83个字符； 如果（字符>=0&&e.which！=8）检查--； 如果（检查<0&&e.which！=8）{ $（this.val（$（this.val（）+'\n'）； lines=$（this.val（）.split（'\n'）； ln=getLineNumber（$（此）[0]）； 字符=行[ln]。长度； 检查=83个字符； 如果（字符>=0&&e.which！=8）检查--； } $（'ct'）。文本（复选框）； }); }); HTML:

左：83

我终于找到了一个有效的解决方案：


JS:

var textarea=document.getElementById（“拆分行”）；
textarea.onkeyup=函数（）{
变量行=textarea.value.split（“\n”）；
对于（变量i=0；i如果（lines[i].length也不起作用：/似乎这也只限制了characters@user2968538，我还剩下什么？
<script type="text/javascript">
var maxLength=83;
function charLimit(el) {
    if (el.value.length > maxLength) return false;
    return true;
}
function characterCount(el) {
    var charCount = document.getElementById('charCount');
    if (el.value.length > maxLength) el.value = el.value.substring(0,maxLength);
    if (charCount) charCount.innerHTML = maxLength - el.value.length;
    return true;
}
</script>

function getLineNumber(textarea) {
    return textarea.value.substr(0, textarea.selectionStart).split("\n").length - 1;
}

$(function(){
    var chars = 0;
    var ln = 0;
    var lines = [];
    var check = 1;
    $('#ta').keyup(function(e){
        lines = $(this).val().split('\n');
        ln = getLineNumber($(this)[0]);
        chars = lines[ln].length;
        check = 83 - chars;
        $('#ct').text(check);        
    }).keydown(function(e){
        lines = $(this).val().split('\n');
        ln = getLineNumber($(this)[0]);
        chars = lines[ln].length;
        check = 83 - chars;
        if(chars >= 0 && e.which != 8) check--;

        if(check < 0 && e.which != 8){
            $(this).val($(this).val() + '\n');
            lines = $(this).val().split('\n');
            ln = getLineNumber($(this)[0]);
            chars = lines[ln].length;
            check = 83 - chars;
            if(chars >= 0 && e.which != 8) check--;
        }
        $('#ct').text(check);
    });
});

<textarea id="ta" cols="85" rows="7"></textarea>
<br/>
Chars Left: <div id="ct">83</div>

var textarea = document.getElementById("splitLines");
textarea.onkeyup = function() {
var lines = textarea.value.split("\n");
for (var i = 0; i < lines.length; i++) {
    if (lines[i].length <= 16) continue;
var j = 0; space = 16;
while (j++ <= 16) {
  if (lines[i].charAt(j) === " ") space = j;
}
lines[i + 1] = lines[i].substring(space + 1) + (lines[i + 1] || "");
lines[i] = lines[i].substring(0, space);
 }
textarea.value = lines.slice(0, 6).join("\n");
};