UI イベント ユーザー インターフェイス イベント_JavaScript スキル

UI イベントはユーザーの動作に直接関係しません。UI イベントには次のものがあります。

DomActivate: このイベントは、ユーザーのマウス イベントやキーボード イベントなどのユーザーの動作によって要素がアクティブ化されるとトリガーされます。このイベントは DOM レベル 3 イベントでは廃止されました。FF2 と chrome ではサポートされているため、このイベントの使用は推奨されません。

Load: window オブジェクトの場合、ページがロードされた後にトリガーされます。frameset の場合、すべてのフレームがロードされた後にトリガーされます。img タグを参照する場合、画像の後にトリガーされます。ロードされているなど

Unload: window オブジェクトでは、ページがアンロードされた後にトリガーされます。frameset では、すべてのフレームがアンロードされた後にトリガーされます。img タグを参照する場合は、画像の後にトリガーされます。荷降ろしなどです。

abort: 要素が完全にロードされていないとき、ユーザーがダウンロード操作を停止する前にトリガーされます。

エラー: ウィンドウの JavaScript でエラーが発生したときにトリガーされ、img をロードできないかオブジェクト要素をロードできないときにトリガーされ、フレームセット内の 1 つ以上のフレームをロードできないときにトリガーされます。
選択: このイベントは、ユーザーがテキスト ボックスで 1 つ以上の文字を選択するとトリガーされます。
サイズ変更: ウィンドウまたはフレームのサイズが変更されるとトリガーされます。
スクロール: ユーザーがスクロール バーで要素をスクロールするとトリガーされます。
HTML イベントの大部分は、ウィンドウ オブジェクトまたはフォーム コントロールに関連しています。
ブラウザが DOM2 レベルのイベントで HTML イベントをサポートしているかどうかを判断するには、次のコードを使用できます。

　　var isSupport = document.implementation.hasFeature('HTMLEvents','2.0');

DOM2 レベルのイベントに実装されている場合は true を返します。それ以外の場合は true を返します。 false

　　var isSupported = document.implementation.hasFeature(“UIEvent”, “3.0”);

dom3 レベルにも同じことが当てはまります。

ロード イベント

ロード イベントは、JavaScript で最も一般的に使用されます。 window オブジェクトの場合、Web ページが完全に読み込まれると、load イベントがトリガーされます。要約すると、HTML には window 要素にアクセスする権限がないため、ウィンドウ上で発生するイベントには body 要素の属性を通じてアクセスできます。

img タグの場合、img タグの src 属性を指定すると、そのloadイベントもトリガーできます。

は次のとおりです。

EventUtil.addHandler(window, “load”, function(){ 
var image = new Image(); 
EventUtil.addHandler(image, “load”, function(event){ 
alert(“Image loaded!”); 
}); 
image.src = “smile.gif”; 
});

IE9 で実行する場合、スクリプト タグ要素など、標準以外の方法でロード イベントをサポートする要素もあります。 、FF、Opera、Chrome、Safari 3.0では、スクリプトが動的に追加され、読み込みが完了すると、スクリプトのloadイベントがトリガーされます。img要素とは異なり、src属性が割り当てられた後にjsファイルの読み込みが開始されます。この要素がドキュメントに追加されました。したがって、イベント ハンドラーの順序は src の割り当てとは関係ありません。
例は次のとおりです。

EventUtil.addHandler(window, “load”, function(){ 
var script = document.createElement(“script”); 
script.type = “text/javascript”; 
EventUtil.addHandler(script, “load”, function(event){ 
alert(“Loaded”); 
}); 
script.src = “example.js”; 
document.body.appendChild(script); 
});

IE と Opera は、リンク タグのロード イベントもサポートしています。

アンロード イベント
ロード イベントの逆は、ドキュメントが完全にアンロードされると、このイベントがトリガーされます。典型的な例としては、ブラウザがあるページから別のページに移動するときにこのイベントがトリガーされ、通常、このイベントはメモリを解放し、不必要なメモリ占有を回避するために使用されます。ロード イベントと同様に、アンロード イベントは 2 つの方法、つまり js を使用する方法と HTML 属性を使用する方法で作成できます。
アンロード イベント ハンドラーには特に注意してください。アンロード イベントが発生するため、すべてのオブジェクトが使用できるわけではなく、ページが読み込まれたときにも引き続き使用できるからです。 Dom ノードの位置を操作したり、外観を変更しようとするとエラーが発生します。

サイズ変更イベント

ブラウザウィンドウの長さと高さが変更されると、このイベントがトリガーされます。登録方法はウィンドウオブジェクト上で発生します。最初の 2 つのイベントの登録方法。

window オブジェクトで発生する他のイベントと同様、DOM ブラウザーでのこのイベントのターゲットはドキュメントを参照し、IE8 以前のバージョンのブラウザーでは使用可能な関連属性はありません。

IE safari chrome opera では、ピクセルの値が変更されている限り、サイズ変更イベントがトリガーされます。 FF では、このイベントはサイズ変更操作が停止したときにのみトリガーされます。また、ブラウザを最大化または最小化すると、このイベントがトリガーされます。

スクロール イベント

スクロール イベントはウィンドウ オブジェクトで発生しますが、ページ レベルの要素にも適用されます。混合モードでは、対応する変更は

要素のscrollLeft属性とscrollTop属性に反映されます。標準モードでは、対応する変更は要素に反映されます。 、例:

EventUtil.addHandler(window, “scroll”, function(event){ 
if (document.compatMode == “CSS1Compat”){//标准模式反映在html上。 
alert(document.documentElement.scrollTop); 
} else { 
alert(document.body.scrollTop); 
} 
});

上記は UI イベント ユーザー インターフェイス イベント_javascript スキルの内容です。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。