Question

我想在一个大文本框（想想博客编辑器）中添加一个单词计数器，它随着我输入的每个单词递增。（即在我输入“Hello”之后，它会从0增加到1，之后我写“世界”之后会增加到2）。我想在网页上这样做，但我很乐意考虑其他选择。

我不知道该怎么做。我认为有一种方法可以用Javascript来做到这一点，但我对Javascript几乎一无所知。

有人能指出我的方法来确定如何做到这一点吗？

Answer 1

我认为实现这一点的好主意是检查输入的字母（例如，onKeyUp事件）。如果前一个字符是非空格且当前不是字母，则增加计数。细节：如果前一个字符是非字母，则不应该增加（双倍空格等）

当用户按Backspace或Delete键时，应进行类似的检查。您可以找到关键代码here

“动态”计数的难点在于检查“非键”输入。例如，用户可以使用Ctrl+Insert组合从剪贴板复制数据，或者在文本框中选择文本，然后按Del键。如果真的需要避免整个价值处理（这可能真的很大），那应该单独处理

Answer 2

在文本框的onkeyup事件中使用此功能。

document.getElementById("inputbox").addEventListener("keyup",function(e){
   // Get the inputs text.
   var inputVal = e.srcElement.value;
   var counter = 0;
   // Check input isn't empty.
   if(inputVal){
       // Count individual letters.
       var wordlist = inputVal.split(" ");
       for(var i=0;i<wordlist.length;i++)
           if(wordlist[i])
               counter = counter+1;
   }
   // Then set your counter element.
   document.getElementById("counter").value = counter;
});

瞬时字计数器

2 个答案: