ValidityState: tooLong property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since December 2018.

The read-only tooLong property of the ValidityState interface indicates if the value of an or

js
const userInput = document.getElementById("userText");
const logElement = document.getElementById("log");

function log(text) {
  logElement.innerText = text;
}

userInput.addEventListener("input", () => {
  userInput.reportValidity();
  if (userInput.validity.tooLong) {
    log("Too many characters in the textarea.");
  } else {
    log("Input is valid…");
  }
});