DragEvent インターフェイスは、ドラッグアンドドロップの対話を表す DOM イベントです。ユーザーはタッチ面でポインティングデバイス (マウスなど) を置くことによりドラッグを開始して、ポインタを新たな場所 (別の DOM 要素など) にドラッグします。アプリケーションは独自の方法で、ドラッグアンドドロップの操作を自由に解釈できます。
このインターフェイスは、MouseEvent および Event のプロパティを継承します。
プロパティ
DragEvent.dataTransfer読取専用- ドラッグアンドドロップの操作で動かされているデータです。
コンストラクター
このインターフェイスにはコンストラクターがありますが、役に立つ DataTransfer オブジェクトをスクリプトから作成することはできません。これは DataTransfer オブジェクトに、ドラッグアンドドロップ中にブラウザーによって調整される処理やセキュリティのモデルがあるためです。
DragEvent()- 本物ではなく、また信頼されていない DragEvent を作成します。
イベントタイプ
drag- このイベントは、要素や選択テキストがドラッグされているときに発生します。
dragend- このイベントは、(マウスボタンを離したり、Esc キーを押下して) ドラッグ操作が終了したときに発生します。
dragenter- このイベントは、ドラッグされた要素や選択テキストが有効なドロップ先に入ったときに発生します。
dragexit- このイベントは、要素がドラッグ操作の直接的な選択対象ではなくなったときに発生します。
dragleave- このイベントは、ドラッグされた要素や選択テキストが有効なドロップ先から出たときに発生します。
dragover- このイベントは、要素や選択テキストが有効なドロップ先の上をドラッグされたときに (マウスが動いていない場合は 50 ミリ秒ごとに、それ以外は 5 ミリ秒ごと (遅い動作) か 1 ミリ秒ごと (速い動作) の間隔です。この発生パターンは
mouseoverとは異なります) 発生します。 dragstart- このイベントは、ユーザーが要素や選択テキストのドラッグを開始したときに発生します。
drop- このイベントは、要素や選択テキストが有効なドロップ先にドロップされたときに発生します。
GlobalEventHandlers
GlobalEventHandlers.ondragdragイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondragenddragendイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondragenterdragenterイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondragexitdragexitイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondragleavedragleaveイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondragoverdragoverイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondragstartdragstartイベントのグローバルイベントハンドラー。GlobalEventHandlers.ondropdropイベントのグローバルイベントハンドラ。
例
各プロパティ、コンストラクター、イベントタイプおよびグローバルイベントハンドラーの例は、それぞれのリファレンスページに掲載しています。
仕様
| 仕様書 | 策定状況 | コメント |
|---|---|---|
| HTML Living Standard DragEvent の定義 |
現行の標準 | |
| HTML 5.1 DragEvent の定義 |
勧告 | 最初の定義 |
ブラウザー実装状況
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
| 機能 | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| 基本サポート | 4 |
(有) |
3.5 (1.9.1) | 10 | 12 | 3.1 |
| 機能 | Android | Android Webview | Chrome for Android | Edge | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|---|---|
| 基本サポート | 未サポート | 未サポート | 未サポート | (有) | 未サポート | 未サポート | 10 | 未サポート | 未サポート |