javascriptメモ整理(イベント)
2915 ワード
一、イベント駆動
1.イベントjavascriptが検出したユーザーの操作またはページの一部の行為(どうやって発生したのか)
2.事件の発生源となる要素(誰が発生しますか?)
3.イベントハンドラのイベントハンドラのプログラムまたは関数(何かが発生しましたか?)
二、事件の分類
1.マウスイベント
onclickマウスクリックイベント
ondblclick マウスでイベントをダブルクリック
onmousedown マウスを押します
onmouseup マウスを離す
onmousemove マウスで移動
onmouseover マウスを移動
onmousout マウスを移動
2.キーボードイベント
onkeyup あるキーボードが解放されました.
onkeydown キーボードが押されました.
onkeyress キーが押されて解除されます.
3.フォームイベント
onsubmit 確認ボタンがクリックされました.
onblur 元素がフォーカスを失う
onfoucs 元素がフォーカスを得る
オンチャン 元素ドメインの内容変更
4.ページイベント
onload ページまたは画像の読み込みが完了した場合
ワンロード ユーザがページを終了します
onbeforeunload ページが閉じているときにダイアログが開きます(閉じると確定します).更新すると呼び出しられます.
二、バインディングイベント
1.スクリプトにバインドする
2.直接HTML元素にバインドする
二、同じイベントを結合した複数のイベントハンドラは匿名関数の削除をサポートしていません.
IE(6-8)
オブジェクト.atachEvent(「イベント(on)」、「処理プログラム」)---追加
オブジェクト.detachEvent(「イベント(on)」、「処理プログラム」)---削除
FF,IE 9+,Google
オブジェクト.addEvent Listener(「イベント」、「処理プログラム」、ブール値)---追加
オブジェクト.removeveveveveveventListener(「イベント」「処理プログラム」「ブール値」)→削除
javascriptイベントの対象例
一、イベントオブジェクト(イベント発生時の関連情報を記録する対象)
1.イベントが発生した時のみ発生し、処理関数内部でのみアクセスできます.
2.処理関数の運転が終わったら自動的に廃棄します.
二、イベントオブジェクトの取得方法
IE: window.イベント
FF: オブジェクト.onイベント=function(e){}
三、イベントオブジェクトの属性
1.マウスイベントに関するイベントオブジェクト
ブラウザの位置に対する
clientX---マウスイベントが発生した場合、ブラウザX軸に対するマウスの位置
clientY---マウスイベントが発生した場合、ブラウザY軸に対するマウスの位置
スクリーンの位置に対する
screenX---マウスのイベントが発生した時、マウスのスクリーンX軸に対する位置
screenY---マウスのイベントが発生した時、マウスのスクリーンX軸に対する位置
イベントソースに対する位置
IE,Google
offsetX---マウスイベントが発生した場合、イベントソースX軸に対するマウスの位置
オフセット---マウスイベントが発生したときの、イベントのソースY軸に対するマウスの位置
FF
layerX---マウスイベントが発生したとき、マウスのX軸に対する位置
マウスのイベントが発生した時、イベントのソースY軸に対してマウスの位置
2.キーボードイベントのイベントオブジェクトについて
keyCode---キーボードコードを取得し、使用法e.keyCodetype---発生したイベントの種類(主に複数のイベントに共通するイベントハンドラの場合)を返すaltKey---altキーが押されたかどうかを判断し、trueの逆がfalse(論理値)のctrly---ctrlキーが押されたかどうかを判断し、trueの逆がfalse(ブール値)であるかを押します. shiftKey---shiftキーが押されているかどうかを判断し、trueの逆がfalse(ブール値)です.
キー 符号の値
方向は左です 37方向に 38方向右 39方向で 40スペース 32
1.イベントjavascriptが検出したユーザーの操作またはページの一部の行為(どうやって発生したのか)
2.事件の発生源となる要素(誰が発生しますか?)
3.イベントハンドラのイベントハンドラのプログラムまたは関数(何かが発生しましたか?)
二、事件の分類
1.マウスイベント
onclickマウスクリックイベント
ondblclick マウスでイベントをダブルクリック
onmousedown マウスを押します
onmouseup マウスを離す
onmousemove マウスで移動
onmouseover マウスを移動
onmousout マウスを移動
2.キーボードイベント
onkeyup あるキーボードが解放されました.
onkeydown キーボードが押されました.
onkeyress キーが押されて解除されます.
3.フォームイベント
onsubmit 確認ボタンがクリックされました.
onblur 元素がフォーカスを失う
onfoucs 元素がフォーカスを得る
オンチャン 元素ドメインの内容変更
4.ページイベント
onload ページまたは画像の読み込みが完了した場合
ワンロード ユーザがページを終了します
onbeforeunload ページが閉じているときにダイアログが開きます(閉じると確定します).更新すると呼び出しられます.
二、バインディングイベント
1.スクリプトにバインドする
<div id="chen"></div>
<script>
document.getElementById('chen').onclick=function(){
alert('taojiaqu');
}
</script>2.直接HTML元素にバインドする
<div id="chen" onclick="alert('taojiaqu');"></div>//
<script for="two" event="onclick">
alert(" DIV2");
</script>二、同じイベントを結合した複数のイベントハンドラは匿名関数の削除をサポートしていません.
IE(6-8)
オブジェクト.atachEvent(「イベント(on)」、「処理プログラム」)---追加
オブジェクト.detachEvent(「イベント(on)」、「処理プログラム」)---削除
FF,IE 9+,Google
オブジェクト.addEvent Listener(「イベント」、「処理プログラム」、ブール値)---追加
オブジェクト.removeveveveveveventListener(「イベント」「処理プログラム」「ブール値」)→削除
javascriptイベントの対象例
一、イベントオブジェクト(イベント発生時の関連情報を記録する対象)
1.イベントが発生した時のみ発生し、処理関数内部でのみアクセスできます.
2.処理関数の運転が終わったら自動的に廃棄します.
二、イベントオブジェクトの取得方法
IE: window.イベント
FF: オブジェクト.onイベント=function(e){}
三、イベントオブジェクトの属性
1.マウスイベントに関するイベントオブジェクト
ブラウザの位置に対する
clientX---マウスイベントが発生した場合、ブラウザX軸に対するマウスの位置
clientY---マウスイベントが発生した場合、ブラウザY軸に対するマウスの位置
スクリーンの位置に対する
screenX---マウスのイベントが発生した時、マウスのスクリーンX軸に対する位置
screenY---マウスのイベントが発生した時、マウスのスクリーンX軸に対する位置
イベントソースに対する位置
IE,Google
offsetX---マウスイベントが発生した場合、イベントソースX軸に対するマウスの位置
オフセット---マウスイベントが発生したときの、イベントのソースY軸に対するマウスの位置
FF
layerX---マウスイベントが発生したとき、マウスのX軸に対する位置
マウスのイベントが発生した時、イベントのソースY軸に対してマウスの位置
2.キーボードイベントのイベントオブジェクトについて
keyCode---キーボードコードを取得し、使用法e.keyCodetype---発生したイベントの種類(主に複数のイベントに共通するイベントハンドラの場合)を返すaltKey---altキーが押されたかどうかを判断し、trueの逆がfalse(論理値)のctrly---ctrlキーが押されたかどうかを判断し、trueの逆がfalse(ブール値)であるかを押します. shiftKey---shiftキーが押されているかどうかを判断し、trueの逆がfalse(ブール値)です.
キー 符号の値
方向は左です 37方向に 38方向右 39方向で 40スペース 32