JavaScript code for counting the words input into an input box

Question

I am supposed to write a function which can count the words in the text area but my code count only the first word, you can see the code here:

link to my code

var myTextareaElement = document.getElementById("myWordsToCount");
myTextareaElement.onkeyup = function wordcount(wor){
  var myTextareaElement =document.getElementById("myWordsToCount").value;
  var haveByNow = 0;
  for (var i = 0; i < wordcount.length; i++)
    if (wor[i] === " ") {
      haveByNow = +1;
    }
  haveByNow += 1;
  document.getElementById("wordcount").innerHTML = haveByNow;
}

Btw, this question has been asked many times before.

Evan Davis
– Evan Davis

2016-03-18 20:45:41 +00:00
Commented Mar 18, 2016 at 20:45 — Evan Davis
– Evan Davis, Commented Mar 18, 2016 at 20:45

The Process · Accepted Answer · 2016-03-18 20:47:29Z

1

Why not splitting on empty character that textarea value and get arraylength:
Check the snippet below

var myTextareaElement = document.getElementById("myWordsToCount");
myTextareaElement.onkeyup = function wordcount(wor) {

  var myText = this.value.trim();
  var wordsArray = myText.split(/\s+/g);
  var words = wordsArray.length;


  document.getElementById("wordcount").innerHTML = words;
};

<textarea id="myWordsToCount"></textarea>

<span id="wordcount"></span>

edited Mar 18, 2016 at 20:47

answered Mar 18, 2016 at 20:09

The Process

5,9533 gold badges33 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Evan Davis Over a year ago

You should trim the value first; right now "ab ce " counts 3.

Noah Freitas Over a year ago

To followup on @Mathletics comment: you could also split on a whitespace regex: var wordsArray = myText.split(/\s+/g);

The Process Over a year ago

@Mathletics thanks for the heads up, don't know how I passed over that.

isvforall · Accepted Answer · 2016-03-18 20:20:22Z

0

You have some typos and errors, see working code:

var myTextareaElement = document.getElementById("myWordsToCount");

myTextareaElement.onkeyup = function wordcount(wor){
    var words = myTextareaElement.value;
    var haveByNow = 1;
    for (var i = 0; i < words.length; i++) {
        if (words[i] == " ") {
            haveByNow += 1;
        }
    }
    document.getElementById("wordcount").innerHTML = haveByNow;
}

<textarea id="myWordsToCount" rows="5" cols="60"></textarea><br>
The wordcount is: <span id="wordcount"></span><br>

edited Mar 18, 2016 at 20:20

answered Mar 18, 2016 at 20:15

isvforall

8,9166 gold badges39 silver badges52 bronze badges

Comments

Jacob · Accepted Answer · 2016-03-18 21:43:00Z

0

This line:

haveByNow = +1;

...is not the same as:

haveByNow += 1;

The former sets haveByNow to 1, the other increments. This is why you'd be seeing a result of 1 every time.

Another problem is this expression in your for loop:

wordcount.length

wordcount is the name of your function, and wordcount.length is the number of parameters of that function, which is not going to be what you want. myTextareaElement, which is the value of the input is what you want to get the length of:

for (var i = 0; i < myTextareaElement.length; i++) ...

Though as @itsgoingdown points out, there are better ways to get a word count.

edited Mar 18, 2016 at 21:43

answered Mar 18, 2016 at 20:10

Jacob

79k24 gold badges159 silver badges245 bronze badges

1 Comment

Noah Freitas Over a year ago

A function's .length property is the number of formal parameters the function declares, not the number of source code characters in its body.

Collectives™ on Stack Overflow

JavaScript code for counting the words input into an input box

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related