DOM

UIEvent.detail プロパティ

 編集:2022.10.04 by T.A.

[Edge]。読取専用。→

UIEvent の、0 以外の値の場合には現在(イベントによっては次)のクリック数を数値で示します。

click または dblclick イベントでは、UIEvent.detail は現在のクリック数です。

mousedown または mouseup イベントでは、UIEvent.detail は現在のクリック数に1 を加えたものです。

他の UIEvent オブジェクトでは、UIEvent.detail は常にゼロです。

構文
UIEvent.detail

数値のようです。

HTML:

<SPAN id=IdTest1>[ここでマウスボタン操作してみて…]</SPAN><BR>
<SPAN id=IdTest2>[ここでマウスボタン操作してみて…]</SPAN><BR>
<SPAN id=IdTest3>[ここでマウスボタン操作してみて…]</SPAN><BR>
<SPAN id=IdTest4>[ここでマウスボタン操作してみて…]</SPAN><BR>
<SPAN id=IdLog></SPAN>

JavaScript:

function Job(eve){ //各イベントの処理:
  D=eve; //=[object]:[object PointerEvent]。IdTest1でクリックを3回連続行った。
詳細 //isTrusted=[boolean]:true //pointerId=[number]:1 //width=[number]:1 //height=[number]:1 //pressure=[number]:0 //tiltX=[number]:0 //tiltY=[number]:0 //azimuthAngle=[number]:0 //altitudeAngle=[number]:1.5707963267948966 //tangentialPressure=[number]:0 //twist=[number]:0 //pointerType=[string]:mouse //isPrimary=[boolean]:false //getCoalescedEvents=[function]:function getCoalescedEvents() { [native code] } //getPredictedEvents=[function]:function getPredictedEvents() { [native code] } //screenX=[number]:404 //screenY=[number]:150 //clientX=[number]:197 //clientY=[number]:75 //ctrlKey=[boolean]:false //shiftKey=[boolean]:false //altKey=[boolean]:false //metaKey=[boolean]:false //button=[number]:0 //buttons=[number]:0 //relatedTarget=[object]:null //pageX=[number]:197 //pageY=[number]:1183 //x=[number]:197 //y=[number]:75 //offsetX=[number]:179 //offsetY=[number]:34 //movementX=[number]:0 //movementY=[number]:0 //fromElement=[object]:null //toElement=[object]:null //layerX=[number]:197 //layerY=[number]:1183 //getModifierState=[function]:function getModifierState() { [native code] } //initMouseEvent=[function]:function initMouseEvent() { [native code] } //view=[object]:[object Window] //detail=[number]:3 //sourceCapabilities=[object]:[object InputDeviceCapabilities] //which=[number]:1 //initUIEvent=[function]:function initUIEvent() { [native code] } //type=[string]:click //target=[object]:[object HTMLSpanElement] //currentTarget=[object]:null //eventPhase=[number]:0 //bubbles=[boolean]:true //cancelable=[boolean]:true //defaultPrevented=[boolean]:false //composed=[boolean]:true //…
IdLog.innerHTML=eve.detail; //表示。 } IdTest1.onclick=Job; //イベント割り当て。 IdTest2.ondblclick=Job; //イベント割り当て。 IdTest3.onmousedown=Job; //イベント割り当て。 IdTest4.onmouseup=Job; //イベント割り当て。

click イベントではクリックした回数。

dblclick イベントでは必ず 2 となった。

mousedown イベントではボタン降下分の回数。

mouseup イベントではボタンを放した回数。

いずれも操作を素早くしないといけない。


テスト