« javascript バブリングの抑止 | メイン | マウスホイール javascript »
2010年07月15日
イベント起こった要素などなど
http://www.tohoho-web.com/js/event.htm ページがなくなった時のために個人的にピーコ■ 一覧
altKey, button, cancelBubble, captureEvents(), clientX, clientY, ctrlKey, data, event, fromElement, height, keyCode, layerX, layerY, modifiers, offsetX, offsetY, pageX, pageY, reason, returnValue, screenX(IE), screenX(N), screenY(IE), screenY(N), shiftKey, srcElement, srcFilter, target, type(IE), type(N), which, width, x, y
■ イベントオブジェクト(Internet Explorer)
◆ window.event (e4)
onClick="..." などのイベントハンドラの中で参照できるイベントオブジェクトです。イベントの概要については「イベントハンドラ」を参照してください。
◆ window.event.type (e4)
イベントタイプ。たとえば、onClick の時は "click" という文字列となります。
<input type="button" value="Click Me!!"
onclick="alert(window.event.type)">
◆ window.event.keyCode (e4)
◆ window.event.shiftKey (e4)
◆ window.event.ctrlKey (e4)
◆ window.event.altKey (e4)
◆ window.event.button (e4)
keyCode は、イベントが発生した時に、キーボード上のどのキーが押されていたかを示す値（ASCIIコード）。shiftKey、ctrlKey、altKey は、イベントが発生した時に、Shiftキー、Ctrlキー、Altキーが押されていたかどうかを示す真偽値。button は、イベントが発生した時に、マウスのどのボタンが押されていたかを示す値。1 は左ボタン、2 は右ボタン、4 は真中ボタンを示し、2 つ以上のボタンが押された場合はその合計値となります。
<input type="text" onkeypress="alert(window.event.keyCode)">
<input type="button" value="Click Me!!"
onclick="alert(window.event.button)">
◆ window.event.screenX (e4)
◆ window.event.screenY (e4)
◆ window.event.clientX (e4)
◆ window.event.clientY (e4)
◆ window.event.x (e4)
◆ window.event.y (e4)
◆ window.event.offsetX (e4)
◆ window.event.offsetY (e4)
このイベントが発生した場所の座標。screenX、screenY はスクリーン上の座標、clientX、clientY はクライアント領域（ウィンドウ）上の座標、x、y は配置された親要素（通常は BODY 要素）上の座標、offsetX、offsetY は、クリックした要素上の座標を示します。
<img src="xxx.gif" alt="xxx" onclick="alert(
'screen=' + event.screenX + ',' + event.screenY +
', client=' + event.clientX + ',' + event.clientY +
', xy=' + event.x + ',' + event.y +
', offset=' + event.offsetX + ',' + event.offsetY)">
◆ window.event.srcElement (e4)
◆ window.event.fromElement (e4)
srcElement は、このイベントが発生した要素を示すオブジェクト。fromElement は、onMouseOver および onMouseOut イベントが発生した際の、マウスの移動元の要素を示すオブジェクト。
<img src="xxx.gif" alt="xxx" onclick="alert(event.srcElement.src)">
◆ window.event.srcFilter (e4)
onFilterChange イベントが発生した際の、発生元フィルタオブジェクト。
◆ window.event.cancelBubble (e4)
このイベントを上位の要素のイベントハンドラに渡すかどうかを示す真偽値。true を代入すると、上位のイベントハンドラが呼ばれなくなります。
<script type="text/javascript">
<!--
function child() {
alert("child");
event.cancelBubble = true;
}
function parent() {
alert("parent");
}
// -->
</script>
<div style="background-color:red; width:200; height:200;"
onclick="parent()">
<div style="background-color:blue; width:100; height:100;"
onclick="child()">
</div>
</div>
◆ window.event.returnValue = value (e4)
このイベントハンドラの戻り値。通常は「return value;」とするのと同等です。false を代入することにより、「Submitボタンを押した」や「リンクをクリックした」などの、イベント本来の動作を抑制することができます。
◆ window.event.reason (e4)
データソースオブジェクトにおけるデータ転送の状態。0 は成功、1 は中断、2 は失敗を示します。
■ イベントオブジェクト(Netscape Communicator)
◆ object.captureEvents(eventName) (N4)
Netscape Communicator 4.0 でサポートされたイベント処理技術で、イベントのキャプチャを開始します。eventName には、Event.イベント名 を指定します。
◆ event (N4)
イベントハンドラの中で参照可能な event オブジェクトです。
<script type="text/javascript">
<!--
function func(e) {
alert(e.height + "," + e.width);
}
// -->
</script>
<form action="#">
<input type="button" name="B1" onclick="func(event)" value="OK">
</form>
「onxxxx = 関数名」でキャプチャしたイベントハンドラには引数として渡されます。
<script type="text/javascript">
<!--
window.captureEvents(Event.CLICK);
window.onclick = func;
function func(e) {
alert(e.height + "," + e.width);
}
// -->
</script>
◆ event.target (N4)
イメージオブジェクトやボタンオブジェクトなど、最初にイベントが送られたオブジェクトを示します。
◆ event.type (N4)
発生したイベントのタイプを "click" などの文字列で表します。
◆ event.data (N4)
DragDrop の際、ドラッグ＆ドロップしたオブジェクト（ファイルなど）の URL を示す文字列の配列。
◆ event.which (N4)
どのマウスボタンが押されたかを示します。1 が左ボタン、2 が（あれば）真ん中ボタン、3 が右ボタンとなります。
document.onmousedown = func;
function func(e) { alert(e.which); }
◆ event.modifiers (N4)
イベント発生時にどの特殊キーが押されていたかを示します。Windows の場合は Alt（1）、Ctrl（2）、Shift（4）、Meta（8）の、Macintosh の場合はOption（1）、Ctrl（2）、Shift（4）、Command（8）の合計が値となります。
◆ event.screenX (N4)
◆ event.screenY (N4)
◆ event.pageX (N4)
◆ event.pageY (N4)
◆ event.width (N4)
◆ event.height (N4)
◆ event.layerX (N4)
◆ event.layerY (N4)
イベントが発生した場所の、screenX、screenY はスクリーン（ディスプレイ）上の座標、pageX、pageY はページ上の座標、width、height はウィンドウ（フレーム）上の座標、layerX、layerY はレイヤー上の座標、を示します。
投稿者 muuming : 2010年07月15日 16:54