How to detect the clearing of a search HTML5 input with JavaScript?

Spread the love

Sometimes, we want to detect the clearing of a search HTML5 input with JavaScript.

In this article, we’ll look at how to detect the clearing of a search HTML5 input with JavaScript.

How to detect the clearing of a search HTML5 input with JavaScript?

To detect the clearing of a search HTML5 input with JavaScript, we listen to the input event.

For instance, we write

<input id="searchInput" type="search" placeholder="Search" />

to add an input.

Then we write

document.getElementById("searchInput").addEventListener("input", (e) => {
  // ...
});

to select the input with getElementById.

Then we call addEventListener to listen to the input event.

When the search box is cleared, the input event handler is called.

Conclusion

To detect the clearing of a search HTML5 input with JavaScript, we listen to the input event.

Leave a Reply

Your email address will not be published.