Sometimes, we want to count text area characters with JavaScript.
In this article, we’ll look at how to count text area characters with JavaScript.
Count Text Area Characters with JavaScript
To count text area characters with JavaScript, we can listen to the keyup
event on the text area.
Then in the event handler, we can get the length of the value of the text area input string value.
For instance, we can write:
<textarea></textarea>
<div id='count'>
</div>
to add the textarea
element and the div to show the character count.
Then we write:
const textarea = document.querySelector('textarea')
const count = document.getElementById('count')
textarea.onkeyup = (e) => {
count.innerHTML = "Characters left: " + (500 - e.target.value.length);
};
to get the textarea
and div elements with document.querySelector
and document.getElementById
.
Then we set the textarea.onkeyup
property to a function that takes the e
event object as a parameter.
Then we get the input value with e.target.value
which is a string.
The length
property gets the character count.
We set count.innerHTML
to some text that shows the character left count.
Now when we type something into the textarea
, we see the character count.
Count
To count text area characters with JavaScript, we can listen to the keyup
event on the text area.
Then in the event handler, we can get the length of the value of the text area input string value.