javascript - 使用 Simple JavaScript 计算带空格和不带空格的文本区域字符

Question

为了计算在 textarea 中键入的字符，我有一个代码可以计算单词之间的空格。但我希望这两个功能都喜欢在 Simple JavaScript 中计算带空格和不带空格的单词。

由于我不是编程专家，我无法尝试其他方法或框架。我更喜欢原生 JavaScript 代码。

当前 JavaScript 代码来计算带空格的字符：

 

    function countChars(obj){
    document.getElementById("charNum").innerHTML = obj.value.length+' 
    characters';

HTML


    <form name="post" method="POST"> 

<textarea name="new" charset="utf-8" onKeyDown="toggleKBMode(event)" value="copyThisContent" id="newInputID" onKeyPress="javascript:convertThis(event)" style="height:255px; Width:100%; margin-top: -17px; line-height: 15px;" placeholder="Write something.."" onkeyup="countChars(this);"></textarea>

<p id="charNum">0 characters</p>

 </form>

请帮我修改上面的代码，以计算文本区域中带空格和不带空格的字符。如果可能的话，我也期待字数统计功能。

我期待以下网站中已经存在的功能。https://easywordcount.com或https://wordcounter.net/

score 0 · Accepted Answer

使用正则表达式

 function countChars(obj){
    var valLength=obj.value.replace(/\s/g,'').length;
    document.getElementById("charNum").innerHTML = valLength+' 
    characters';}

score 0 · Accepted Answer

问你问题之前你看起来不错吗？

看看这个，或许能帮到你： Show how many characters in a HTML text box using JavaScript

但如果你想做更简单的看下面：

html：

<textarea id="field"></textarea>
       <div id="charNum"></div>

javascript:

$("#field").keyup(function(){
  el = $(this);
  if(el.val().length >= 11){
    el.val( el.val().substr(0, 11) );
  } else {
    $("#charNum").text(el.val().length + '/ 10' );
 }

});

score 0 · Accepted Answer

检查下面的代码片段：

function countChars() {
  var val = document.getElementById("newInputID").value;
  var withSpace = val.length;
  // Without using regex
  //var withOutSpace = document.getElementById("newInputID").value.split(' ').join('').length;
  //with using Regex
  var withOutSpace = val.replace(/\s+/g, '').length;
  var wordsCount = val.match(/\S+/g).length;

  document.getElementById("wordCount").innerHTML = wordsCount + ' words';
  document.getElementById("charNumWithSpace").innerHTML = 'With space: ' + withSpace + '     characters';
  document.getElementById("charNumWithOutSpace").innerHTML = 'Without space: ' + withOutSpace + '     characters';
}

<html>

<body>
  <textarea name="new" charset="utf-8" id="newInputID" style="height:100px; Width:100%; line-height: 15px;" placeholder="Write something.." onkeyup="countChars()"></textarea>

  <p id="wordCount">0 Words</p>
  <p id="charNumWithSpace">0 characters</p>
  <p id="charNumWithOutSpace">0 characters</p>
</body>

</html>

score 0 · Accepted Answer

function countChars(obj){
    const words = obj.value.split(' ');
    words.length // word count
    console.log('word count is ', words.length)

    const noSpaceString = obj.value.split(' ').join('');
    noSpaceString.length // string length with no space
    console.log('all characters without whits space ', noSpaceString.length)
}

score 0 · Accepted Answer

function WordCount() {

    var wordCounterwithSpace = 0;
    var wordCounterwithoutSpace = 0;
    var val = document.getElementById('textAreaId').value;

    for (var i = 0; i < val.length; i++) {
        if (val[i] == ' ') {
            wordCounterwithSpace++;
            continue;
        } else {
            wordCounterwithoutSpace++;
            wordCounterwithSpace++;
        }
    }
    console.log('With Spaces :', wordCounterwithSpace);
    console.log('Without Spaces :', wordCounterwithoutSpace);
}

javascript - 使用 Simple JavaScript 计算带空格和不带空格的文本区域字符

5 回答 5

Related

Reference