oninput、onchange、そしてonpropertychangeイベントの使い方は何ですか。

1年 ago
優斗, 朝陽
1 minute

oninputイベントは、ユーザーがコンテンツを入力する際に発生します。例えば、テキストボックスにテキストを入力したり、ドロップダウンリストから選択したりするときに使用されます。

HTML（エイチティーエムエル）

<input type="text" oninput="myFunction()">

ジャバスクリプト：

function myFunction() {
  console.log("Input changed");
}

onchange イベントは、要素の値が変更され、フォーカスが外れた時に発生します。例えば、テキストボックスに文字を入力した後に他の場所をクリックする場合です。使用方法は次の通りです：

HTML：HTML

<input type="text" onchange="myFunction()">

JavaScriptをネイティブに使ってください。

function myFunction() {
  console.log("Value changed");
}

onpropertychangeイベントは、IEブラウザ独自のイベントであり、要素のプロパティが変更された時に発生します。使用方法は以下の通りです。

HTML:
HTML言語は、Webページを作成するための標準的なマークアップ言語です。

<input type="text" onpropertychange="myFunction()">

JavaScript:
ジャバスクリプト:

function myFunction() {
  console.log("Property changed");
}

大部分の現代ブラウザでoninputとonchangeイベントが適用されるのに対し、onpropertychangeイベントはIEブラウザにのみ適用されることに注意が必要です。

bannerAds