DataTransfer

DataTransfer オブジェクトは、ドラッグ&ドロップ操作中にドラッグされているデータを保持するために使用されます。これは、1 つ以上のデータ項目を保持することができ、それぞれが 1 つ以上のデータ型を持ちます。ドラッグ&ドロップの詳細については、HTML ドラッグ&ドロップ API を参照してください。

このオブジェクトはすべての ドラッグイベントdataTransfer プロパティからアクセスすることができます。

コンストラクタ

DataTransfer()
新規 DataTransfer オブジェクトを作成して返す。

プロパティ一覧

標準プロパティ

DataTransfer.dropEffect
現在選択されているドラッグ&ドロップ操作の種類を取得したり、新しい操作の種類をセットしたりします。値は nonecopylink, move のいずれかです。
DataTransfer.effectAllowed
とりうるすべての操作の種類を与えます。none, copy, copyLink, copyMove, link, linkMove, move, all, uninitialized のいずれかです。
DataTransfer.files
データトランスファーが保持していて利用可能なすべてのローカルファイルのリストを保持します。ドラッグ操作がファイルのドラッグによるものではない場合、このプロパティは空のリストになります。
DataTransfer.items 読取専用
 全てのドラッグデータのリストである DataTransferItemList オブジェクトを返します。.
DataTransfer.types 読取専用
dragstart (en-US) イベントでセットされたフォーマットを示すstringsの配列。

Gecko プロパティ

Experimental

これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

注: この節の全プロパティは Gecko-固有のものです。
DataTransfer.mozCursor (en-US)
ドラッグカーソルの状態を返します。主にタブドラッグの際のカーソルを制御するのに使います。
DataTransfer.mozSourceNode (en-US) 読取専用
ドラッグ操作を開始するためにボタンを押下したときにマウスカーソルのあったNodeを返します。外部アプリケーションからのドラッグの場合や、ドラッグを開始したノードが呼び出し元からアクセスできない物であった場合は、値は null となります。
DataTransfer.mozUserCancelled (en-US) 読取専用
このプロパティは dragend イベントに対してのみ適用され、ユーザーが Esc キーを押下してドラッグ操作を取り消した場合は値が true となります。不正な場所でドロップした場合など、その他の理由でドラッグ操作に失敗した場合には、値は false となります。

Deprecated プロパティ

DataTransfer.mozItemCount (en-US) 読取専用
ドラッグされている項目の個数を返します。Firefox 71 で削除されます。

メソッド

標準メソッド

DataTransfer.clearData()
指定された型のデータを削除します。型の指定は省略可能です。型として空の文字列を指定した場合、もしくは型を指定しなかった場合、すべての型のデータが削除されます。指定された型のデータが存在しない場合、またはデータトランスファーが何もデータを持っていない場合、このメソッドは何もしません。
DataTransfer.getData()
指定された型のデータを取得します。指定された型のデータが存在しない場合、またはデータトランスファーが何もデータを保持していない場合、空文字を返します。
DataTransfer.setData()
指定された型のデータを設定します。その型のデータが存在しない場合、データはリストの最後に追加されるため、データ型のリストの最後の項目は、最後に追加された新しいデータ型となります。その型のデータがすでに存在している場合、データ型のリストにおける元と同じ位置で、古いデータが新しいデータと置き換わります。
DataTransfer.setDragImage()
ドラッグ中に表示されるフィードバックイメージについて、独自のものを使用したい場合に、それをセットします。

Gecko メソッド

非標準

この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。

注: この節の全メソッドは Gecko-固有のものです。
DataTransfer.addElement() (en-US)
ドラッグ元の要素を指定します。

Deprecated メソッド

DataTransfer.mozClearDataAt() (en-US)
指定されたインデックスの項目について、指定された形式に関連付けられたデータを削除します。インデックスは 0〜(項目の数-1)の範囲です。Firefox 71 で削除されます。
DataTransfer.mozGetDataAt() (en-US)
指定されたインデックスの項目の、指定された形式のデータを取得します。存在しない項目またはデータ形式を指定した場合は null を返します。インデックスは 0〜(項目の数-1)の範囲です。Firefox 71 で削除されます。
DataTransfer.mozSetDataAt() (en-US)
データトランスファーは複数の項目を保持する事ができ、それぞれの項目には 0 から始まるインデックスが付けられます。mozSetDataAt() は、すでに存在する項目を変更する場合には mozItemCount より小さい値をインデックスとして指定し、新しい項目を追加する場合は mozItemCount に等しい値をインデックスとして指定します。また、mozItemCount は項目を追加する度に増加します。Firefox 71 で削除されます。
DataTransfer.mozTypesAt() (en-US)
指定されたインデックスの項目が保持しているデータの形式のリスト(文字列の配列)を返します。0〜(項目の数-1)の範囲外のインデックスを指定した場合は、空のリストを返します。Firefox 71 で削除されます。

この文書に載っているすべてのメソッドとプロパティは自分自身のリファレンスページを持ち、そのページに直接例が載っているか、例へのリンクがあるかのいずれかです。

仕様

仕様書 策定状況 コメント
HTML Living Standard
DataTransfer の定義
現行の標準 mozCursor, mozItemCount, mozSourceNode, mozUserCancelled, addElement(), mozClearDataAt(), mozGetDataAt(), mozSetDataAt() and mozTypesAt are Gecko specific.
HTML 5.1
DataTransfer の定義
勧告 Not included in W3C HTML5 勧告

ブラウザー実装状況

BCD tables only load in the browser

関連情報