HTMLInputElement: search event

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

Thesearch event is fired when a search is initiated using an<input> element oftype="search".

There are several ways a search can be initiated, such as by pressingEnter while the<input> is focused, or, if theincremental attribute is present, after a UA-defined timeout elapses since the most recent keystroke (with new keystrokes resetting the timeout so the firing of the event isdebounced).

Current UA implementations of<input type="search"> have an additional control to clear the field. Using this control also fires thesearch event. In that case thevalue of the<input> element will be the empty string.

This event is not cancelable.

Syntax

Use the event name in methods likeaddEventListener(), or set an event handler property.

addEventListener("search", (event) => { })onsearch = (event) => { }

Event type

A genericEvent.

Examples

// addEventListener versionconst input = document.querySelector('input[type="search"]');input.addEventListener("search", () => {  console.log(`The term searched for was ${input.value}`);});

// onsearch versionconst input = document.querySelector('input[type="search"]');input.onsearch = () => {  console.log(`The term searched for was ${input.value}`);};