diff options
Diffstat (limited to 'files/ja/web/api/event/index.html')
-rw-r--r-- | files/ja/web/api/event/index.html | 200 |
1 files changed, 200 insertions, 0 deletions
diff --git a/files/ja/web/api/event/index.html b/files/ja/web/api/event/index.html new file mode 100644 index 0000000000..6004f9a3f6 --- /dev/null +++ b/files/ja/web/api/event/index.html @@ -0,0 +1,200 @@ +--- +title: Event +slug: Web/API/Event +tags: + - API + - DOM + - Event + - Interface + - Reference + - UI + - インターフェイス +translation_of: Web/API/Event +--- +<p>{{APIRef("DOM")}}</p> + +<p><code><strong>Event</strong></code> インターフェイスは、DOM で発生するイベントを表します。ユーザーによって発生するイベント (マウスやキーボードのイベント) もありますし、API によって発生するイベント (アニメーションの実行が完了したことを示すイベントや、動画再生が一時停止したイベントなど) もあります。さまざまな型のイベントがあり、一部のイベントは基底の <code>Event</code> インターフェイスを基にした他のインターフェイスを使用します。<code>Event</code> 自体は、すべてのイベントで共通のプロパティやメソッドを持ちます。</p> + +<h2 id="Introduction" name="Introduction"><code>Event</code> を基にしたインターフェイス</h2> + +<p>以下のリストは <code>Event</code> インターフェイスを基にしたインターフェイスの一覧であり、 MDN API リファレンスの各ドキュメントにリンクしています。すべてのイベントインターフェイスは、名称の末尾が "Event" であることに留意してください。</p> + +<div class="index"> +<ul> + <li>{{domxref("AnimationEvent")}}</li> + <li>{{domxref("AudioProcessingEvent")}}</li> + <li>{{domxref("BeforeInputEvent")}}</li> + <li>{{domxref("BeforeUnloadEvent")}}</li> + <li>{{domxref("BlobEvent")}}</li> + <li>{{domxref("ClipboardEvent")}}</li> + <li>{{domxref("CloseEvent")}}</li> + <li>{{domxref("CompositionEvent")}}</li> + <li>{{domxref("CSSFontFaceLoadEvent")}}</li> + <li>{{domxref("CustomEvent")}}</li> + <li>{{domxref("DeviceLightEvent")}}</li> + <li>{{domxref("DeviceMotionEvent")}}</li> + <li>{{domxref("DeviceOrientationEvent")}}</li> + <li>{{domxref("DeviceProximityEvent")}}</li> + <li>{{domxref("DOMTransactionEvent")}}</li> + <li>{{domxref("DragEvent")}}</li> + <li>{{domxref("EditingBeforeInputEvent")}}</li> + <li>{{domxref("ErrorEvent")}}</li> + <li>{{domxref("FetchEvent")}}</li> + <li>{{domxref("FocusEvent")}}</li> + <li>{{domxref("GamepadEvent")}}</li> + <li>{{domxref("HashChangeEvent")}}</li> + <li>{{domxref("IDBVersionChangeEvent")}}</li> + <li>{{domxref("InputEvent")}}</li> + <li>{{domxref("KeyboardEvent")}}</li> + <li>{{domxref("MediaStreamEvent")}}</li> + <li>{{domxref("MessageEvent")}}</li> + <li>{{domxref("MouseEvent")}}</li> + <li>{{domxref("MutationEvent")}}</li> + <li>{{domxref("OfflineAudioCompletionEvent")}}</li> + <li>{{domxref("PageTransitionEvent")}}</li> + <li>{{domxref("PaymentRequestUpdateEvent")}}</li> + <li>{{domxref("PointerEvent")}}</li> + <li>{{domxref("PopStateEvent")}}</li> + <li>{{domxref("ProgressEvent")}}</li> + <li>{{domxref("RelatedEvent")}}</li> + <li>{{domxref("RTCDataChannelEvent")}}</li> + <li>{{domxref("RTCIdentityErrorEvent")}}</li> + <li>{{domxref("RTCIdentityEvent")}}</li> + <li>{{domxref("RTCPeerConnectionIceEvent")}}</li> + <li>{{domxref("SensorEvent")}}</li> + <li>{{domxref("StorageEvent")}}</li> + <li>{{domxref("SVGEvent")}}</li> + <li>{{domxref("SVGZoomEvent")}}</li> + <li>{{domxref("TimeEvent")}}</li> + <li>{{domxref("TouchEvent")}}</li> + <li>{{domxref("TrackEvent")}}</li> + <li>{{domxref("TransitionEvent")}}</li> + <li>{{domxref("UIEvent")}}</li> + <li>{{domxref("UserProximityEvent")}}</li> + <li>{{domxref("WebGLContextEvent")}}</li> + <li>{{domxref("WheelEvent")}}</li> +</ul> +</div> + +<h2 id="Constructor" name="Constructor">コンストラクター</h2> + +<dl> + <dt>{{domxref("Event.Event", "Event()")}}</dt> + <dd><code>Event</code> オブジェクトを生成して、呼び出し元に返します。</dd> +</dl> + +<h2 id="Properties" name="Properties">プロパティ</h2> + +<dl> + <dt>{{domxref("Event.bubbles")}} {{readonlyinline}}</dt> + <dd>イベントが DOM を通して浮上 (bubble up) するかを示す boolean 値です。</dd> + <dt>{{domxref("Event.cancelBubble")}}</dt> + <dd>{{domxref("Event.stopPropagation()")}} の歴史的な別名です。イベントハンドラーから戻る前に値 <code>true</code> を設定すると、イベントの伝播を抑制します。</dd> + <dt>{{domxref("Event.cancelable")}} {{readonlyinline}}</dt> + <dd>イベントがキャンセル可能かを示す boolean 値です。</dd> + <dt>{{domxref("Event.composed")}} {{ReadOnlyInline}}</dt> + <dd>shadow DOM と 通常の DOM の間の境界を越えてイベントが伝播できるかをを示す Boolean 値です。</dd> + <dt>{{domxref("Event.currentTarget")}} {{readonlyinline}}</dt> + <dd>イベントが現在登録されているターゲットへの参照。これは、現在イベントの送信先として予定されているオブジェクトです。これは<em>リターゲティング</em>によって、途中で変更できます。</dd> + <dt>{{domxref("Event.deepPath")}} {{non-standard_inline}}</dt> + <dd>イベントの伝播で通り抜けた DOM {{domxref("Node")}} の {{jsxref("Array")}} です。</dd> + <dt>{{domxref("Event.defaultPrevented")}} {{readonlyinline}}</dt> + <dd>{{domxref("event.preventDefault()")}} がイベントで呼ばれたかどうかを示します。</dd> + <dt>{{domxref("Event.eventPhase")}} {{readonlyinline}}</dt> + <dd>イベントの流れのうちどの段階が処理されているかを示します。</dd> + <dt>{{domxref("Event.explicitOriginalTarget")}} {{non-standard_inline}} {{readonlyinline}}</dt> + <dd>イベントの明確な最初のターゲット (Mozilla 特有)。</dd> + <dt>{{domxref("Event.originalTarget")}} {{non-standard_inline}} {{readonlyinline}}</dt> + <dd>イベントの再ターゲット前の最初のターゲット (Mozilla 特有)。</dd> + <dt>{{domxref("Event.returnValue")}}</dt> + <dd>Internet Explorer によって導入された歴史的なプロパティで、既存のサイトが動作し続けることを保証するために結果的に DOM 仕様書に導入されたものです。理想的には、 {{domxref("Event.preventDefault()")}} および {{domxref("Event.defaultPrevented")}} を代わりに使用してみるべきですが、選択次第では <code>returnValue</code> を使用することができます。</dd> + <dt>{{domxref("Event.srcElement")}} {{non-standard_inline}}</dt> + <dd>{{domxref("Event.target")}} の、(古いバージョンの Microsoft Internet Explorer 由来の) 標準外の別名であり、ウェブの互換性の目的で一部の他のブラウザーでも対応が始められています。</dd> + <dt>{{domxref("Event.target")}} {{readonlyinline}}</dt> + <dd>イベントが最初に送出されたターゲットへの参照。</dd> + <dt>{{domxref("Event.timeStamp")}} {{readonlyinline}}</dt> + <dd>イベントが生成された時刻をミリ秒単位で示します。仕様書ではこの値をエポックから経過した時間としていますが、実際のブラウザの定義は異なります。また、値を {{domxref("DOMHighResTimeStamp")}} に変更する作業が進行中です。</dd> + <dt>{{domxref("Event.type")}} {{readonlyinline}}</dt> + <dd>イベントの名前 (大文字小文字を区別しません)。</dd> + <dt>{{domxref("Event.isTrusted")}} {{readonlyinline}}</dt> + <dd>イベントがブラウザーによって開始されたか (たとえばユーザークリックの後)、または、スクリプトによって開始されたか (<a href="/ja/docs/DOM/event.initEvent">event.initEvent</a> のようなイベントを作るメソッドの使用) どうかを示します。</dd> +</dl> + +<h3 id="Obsolete_properties" name="Obsolete_properties">廃止されたプロパティ</h3> + +<dl> + <dt>{{domxref("Event.scoped")}} {{readonlyinline}} {{obsolete_inline}}</dt> + <dd>{{jsxref("Boolean")}} で、指定されたイベントが標準 DOM の中のシャドウルートを通してバブルするかどうかを示します。このプロパティは {{domxref("Event.composed", "composed")}} に改名されました。</dd> +</dl> + +<h2 id="Methods" name="Methods">メソッド</h2> + +<dl> + <dt>{{domxref("Event.createEvent()")}} {{deprecated_inline}}</dt> + <dd> + <p>新しいイベントを作成し、これはその後で <code>initEvent()</code> メソッドを呼び出すことで初期化する必要があります。</p> + </dd> + <dt>{{domxref("Event.composedPath()")}}</dt> + <dd>(リスナーが呼び出されるオブジェクトへの) イベントのパスを返します。これはシャドウルートが {{domxref("ShadowRoot.mode")}} が閉じた状態で作成されたシャドウツリーのノードを含みません。</dd> +</dl> + +<dl> + <dt>{{domxref("Event.initEvent()")}} {{deprecated_inline}}</dt> + <dd>生成されたイベントの値を初期化します。イベントがすでにディスパッチされている場合は、何も行いません。</dd> + <dt>{{domxref("Event.preventDefault()")}}</dt> + <dd>イベントをキャンセルします (キャンセル可能な場合のみ)。</dd> + <dt>{{domxref("Event.stopImmediatePropagation()")}}</dt> + <dd>この特定のイベントのために、他のいかなるリスナーも呼び出されません。同じ要素に付けられたリスナーも、後で横断される(たとえばキャプチャー段階の) 要素に付けられたリスナーも呼び出されません。</dd> + <dt>{{domxref("Event.stopPropagation()")}}</dt> + <dd>これ以上イベントが 伝播 (propagation) するのを停止します。</dd> +</dl> + +<h3 id="Obsolete_methods" name="Obsolete_methods">廃止されたメソッド</h3> + +<dl> + <dt>{{domxref("Event.getPreventDefault()")}} {{non-standard_inline}}</dt> + <dd>標準外です。{{domxref("Event.defaultPrevented")}} の値を返します。代わりに {{domxref("Event.defaultPrevented")}} を使用してください。</dd> + <dt>{{domxref("Event.preventBubble()")}} {{non-standard_inline}} {{Obsolete_inline(24)}}</dt> + <dd>イベントが 浮上 (bubble up) しないようにします。廃止されたので、代わりに {{domxref("event.stopPropagation")}} を使ってください。</dd> + <dt>{{domxref("Event.preventCapture()")}} {{non-standard_inline}} {{Obsolete_inline(24)}}</dt> + <dd>廃止されたので、{{domxref("event.stopPropagation")}} を使ってください。</dd> +</dl> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('DOM WHATWG', '#interface-event', 'Event')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> + +<p class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</p> + +<p>{{Compat("api.Event")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>利用できるイベントのタイプ: <a href="/ja/docs/Web/Reference/Events">イベントリファレンス</a></li> + <li><a href="/ja/docs/Web/API/Event/Comparison_of_Event_Targets">イベントターゲットの比較</a> (target vs currentTarget vs relatedTarget vs originalTarget)</li> + <li><a href="/ja/docs/Web/Guide/DOM/Events/Creating_and_triggering_events">カスタムイベントの作成と発火</a></li> + <li>Firefox アドオン開発者向け: + <ul> + <li><a href="/ja/docs/Listening_to_events_in_Firefox_extensions">Listening to events in Firefox extensions</a></li> + <li><a href="/ja/docs/Listening_to_events_on_all_tabs">Listening to events on all tabs</a></li> + </ul> + </li> +</ul> |