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.