Movatterモバイル変換


[0]ホーム

URL:


  1. 開発者向けのウェブ技術
  2. Web API
  3. HTMLInputElement
  4. search

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。

View in EnglishAlways switch to English

HTMLInputElement: search イベント

非標準: この機能は標準化されていません。非標準の機能はブラウザーの対応が限られ、将来的に変更または削除される可能性があるため、本番環境での使用は推奨されません。ただし、標準の選択肢が存在しない特定のケースでは、有効な代替手段となる場合があります。

search イベントは、<input> 要素のtype="search" にて検索が開始されたときに発生します。

検索を開始する方法はいくつかあり、例えば、<input> にフォーカスがある時にEnter を押したり、incremental 属性が存在すれば、最も新しいキー入力から UA 定義のタイムアウト時間が経過してから検索が開始されます(新しくキー入力をするとタイムアウトがリセットされるので、イベントが繰り返して発生します)。

現在 UA が<input type="search"> を実装している方法では、フィールド内をクリアするために追加のコントロールを置きます。このコントロールを使用してもsearch イベントが発生します。この場合、<input> 要素のvalue は空文字列になります。

このイベントはキャンセル不可です。

構文

このイベント名を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}`);};

仕様書

このイベントは仕様書に含まれていません。

ブラウザーの互換性

Help improve MDN

Learn how to contribute

This page was last modified on byMDN contributors.


[8]ページ先頭

©2009-2025 Movatter.jp