HTMLInputElement: search event
Non-standard: This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
The search
event is fired when a search is initiated using an <input>
element of type="search"
.
There are several ways a search can be initiated, such as by pressing Enter while the <input>
is focused, or, if the incremental
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 is debounced).
Current UA implementations of <input type="search">
have an additional control to clear the field. Using this control also fires the search
event. In that case the value
of the <input>
element will be the empty string.
This event is not cancelable.
Syntax
Use the event name in methods like addEventListener()
, or set an event handler property.
js
addEventListener("search", (event) => {});
onsearch = (event) => {};
Event type
A generic Event
.
Examples
js
// addEventListener version
const input = document.querySelector('input[type="search"]');
input.addEventListener("search", () => {
console.log(`The term searched for was ${input.value}`);
});
js
// onsearch version
const input = document.querySelector('input[type="search"]');
input.onsearch = () => {
console.log(`The term searched for was ${input.value}`);
};
Specifications
This event is not part of any specification.
Browser compatibility
BCD tables only load in the browser