Question

我在设置textarea的限制字符方面有一点问题。

我一直试图显示我可以写的字符数限制以及我可以继续写的字符键。

限制为10个字符但是当我按下第一个键时，输出会一直显示10个“空格”以继续写入。当我写下最后一个字符（理论上）时，输出节目可以按另一个字符，但这就像一个不可见的字符。

也许我已经忘记了如何做数学，但我很感激任何帮助（如果代码有其他问题，请告诉我）。

这是HTML部分：

<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <textarea id='text'></textarea>
  <br />
  <span>Characters <span id='info'></span></span>
</body>
</html>

这是JavaScript：

function showTill(limit){

var getId = document.getElementById('text');

  var shot = getId.onkeydown = exe;

  function exe(stuff){

  var getSpan= document.getElementById('info');
  var printSpan = getSpan.innerHTML = limit - getId.value.length; //prints qty of character keys I can write yet.

  var evento = stuff || window.event;
  var combine = evento.which || evento.keyCode; 
  var omitDel = combine === 8 || combine === 46; //Enabling Backspace and Delete after reaching the limit of character written.
  var omitArrow = combine === 37 || combine === 39; //Enabling Right/Left Arrows after reaching the limit of character written.    

  if (getId.value.length >= limit && !omitDel && !omitArrow){ 
    return false;
  }else{
    return true;
  }
  }
}


showTill(10);

谢谢！

Answer 1

如果我理解发生了什么，解释就是事件处理。

您正在捕捉onkeydown事件。因此，第一次按下某个键时，会触发事件，getId.value.length显示0，这是正确的。那个时候没有人物。当事件处理程序已完成其工作时，字符将在稍后显示。所以你在第一次按下char后显示Character 10。现在，按另一个，getId.value返回1：长度1，因为那时只有一个字符，第二个字符串即将到来，但还没有...

然后按10个字符，但Character字段显示1。

你会得到onkeypress

的类似行为

我们必须计入第一个“错过”的字符。我会将事件处理功能更改为

function exe(stuff) {
    var printSpan;

    var getSpan = document.getElementById('info');
    //var printSpan = getSpan.innerHTML = limit - (getId.value.length + 1); //prints qty of character keys I can write yet.

    var evento = stuff || window.event;
    var combine = evento.which || evento.keyCode; 
    var isDel = combine === 8 || combine === 46; //Enabling Backspace and Delete after reaching the limit of character written.
    var isArrow = combine === 37 || combine === 39; //Enabling Right/Left Arrows after reaching the limit of character written.    

    if ((getId.value.length + 1) > limit && !isDel && !isArrow) {
        return false;
    } else {
        if (isArrow) {
            // do nothing
            return true;
        }

        if (isDel)
            printSpan = getSpan.innerHTML = limit - (getId.value.length - 1);
        else
            printSpan = getSpan.innerHTML = limit - (getId.value.length + 1);

        return true;
    }
}

Textarea：显示我可以编写的错误的字符数量

1 个答案: