このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。
HTMLInputElement: search イベント
非標準: この機能は標準化されていません。非標準の機能はブラウザーの対応が限られ、将来的に変更または削除される可能性があるため、本番環境での使用は推奨されません。ただし、標準の選択肢が存在しない特定のケースでは、有効な代替手段となる場合があります。
search イベントは、<input> 要素のtype="search" にて検索が開始されたときに発生します。
検索を開始する方法はいくつかあり、例えば、<input> にフォーカスがある時にEnter を押したり、incremental 属性が存在すれば、最も新しいキー入力から UA 定義のタイムアウト時間が経過してから検索が開始されます(新しくキー入力をするとタイムアウトがリセットされるので、イベントが繰り返して発生します)。
現在 UA が<input type="search"> を実装している方法では、フィールド内をクリアするために追加のコントロールを置きます。このコントロールを使用してもsearch イベントが発生します。この場合、<input> 要素のvalue は空文字列になります。
このイベントはキャンセル不可です。
In this article
構文
このイベント名をaddEventListener() 等のメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
js
addEventListener("search", (event) => {});onsearch = (event) => {};イベント型
一般的なEvent です。
例
js
// addEventListener 版const input = document.querySelector('input[type="search"]');input.addEventListener("search", () => { console.log(`The term searched for was ${input.value}`);});js
// onsearch 版const input = document.querySelector('input[type="search"]');input.onsearch = () => { console.log(`The term searched for was ${input.value}`);};仕様書
このイベントは仕様書に含まれていません。