dataTransferNN なし IE 5(Win) DOM なし

dataTransfer オブジェクト (event オブジェクトのプロパティとしてアクセスが可能) は、Windows 版 IE 5 以降のスクリプトで、テキストデータの転送時に使用できる一時的なコンテナです。特に、カット、コピー、ペーストのシミュレートやドラッグの制御など、スクリプト制御による操作に使用できます。スクリプトでは、要素のテキストのみ、要素の HTML 全体、またはイメージの URL など、dataTransfer オブジェクトに格納するデータの種類を制御できます。たとえば、子供向けのページで何種類かの動物のシンプルなアイコンイメージが表示されているとします。ユーザーが犬のアイコンをドラッグし始めると、img 要素の ondragstart イベントハンドラーを介して起動されたスクリプトが、この要素のカスタム属性値 (犬の写真の URL など) を dataTransfer オブジェクトに格納します。このアイコンを特定の領域にドロップすると、ondrop イベントハンドラーの関数が dataTransfer オブジェクトのデータを読み取り、イメージをページ上の領域に読み込みます。

 

新たなイベントアクションが発生するたびにイベントオブジェクトによりプロパティが変更される場合であっても、dataTransfer オブジェクトには、スクリプトによってオブジェクトやその他のデータが削除されるまで、データが保持されます。dataTransfer オブジェクトのプロパティの機能は、clipboardData オブジェクトの機能とは異なっています。dropEffect プロパティと effectAllowed プロパティを設定すると、ドラッグ & ドロップ操作の間に表示されるカーソルアイコンのタイプをスクリプトで制御できます。例 9-1 に、dataTransfer オブジェクトのプロパティやメソッドをドラッグイベントに関連付けることにより、カーソルをドロップターゲットの上に置くと、形が "コピー" スタイルに変化する例を示します。

 

このオブジェクトによるデータ転送、および clipboardData オブジェクトの詳細については、http://msdn.microsoft.com/workshop/author/datatransfer/overview.asp を参照してください。

 
相当する HTML コード

なし

 
オブジェクト参照
 
[window.]event.dataTransfer
 
オブジェクト固有のプロパティ
 
dropEffecteffectAllowed
 
オブジェクト固有のメソッド
 
clearData()getData()setData()
 
オブジェクト固有のイベントハンドラープロパティ

なし

dropEffect、effectAllowedNN なし IE 5 DOM なし

読み書き

これら 2 つのプロパティは連携して機能しますが、その対象となるステージは dataTransfer オブジェクトが関係するドラッグ操作時において異なります。どちらのプロパティも、ドラッグ & ドロップ操作時のカーソル表示を制御します。ドラッグ操作開始時のカーソルスタイルは、ondragstart イベントと effectAllowed プロパティを介して設定します。ドロップターゲットの ondragover イベントハンドラーおよび ondragenter イベントハンドラーでは、dropEffect プロパティを目的のカーソルスタイルに設定し、また event.returnValue プロパティは false に設定します。これにより、ondrop イベントハンドラーで、dropEffect プロパティによるカーソル設定だけでなく、ドロップ操作の処理も可能となります。これらのイベントやプロパティのインタラクションの簡単な実例については、例 9-1 を参照してください。

 
 
event.dataTransfer.dropEffect= "copy";
 

copylinkmovenone のいずれかの定数を示す文字列。大文字と小文字は区別されません。

 
既定値

none

clearData()NN なし IE 5(Win) DOM なし

clearData([dataFormat])

dataTransfer オブジェクトからデータを削除します。

 
パラメータ
 
  • 削除するデータのフォーマットを指定する文字列。省略可能です。当初は、複数のデータタイプに対応する予定でしたが、未対応のままです。IE 6 で確実に指定できるフォーマットは Text のみです。このパラメータを省略すると、すべてのデータタイプが削除されます。
 
戻り値

なし

getData()NN なし IE 5(Win) DOM なし

getData(dataFormat)

dataTransfer オブジェクトに格納されたデータのコピーを返します。dataTransfer のコンテンツに変化はないため、以降も別のスクリプトステートメントで読み出すことができます。

 
パラメータ
 
  • 読み出すデータのフォーマットを指定する文字列。当初は、複数のデータタイプに対応する予定でしたが、未対応のままです。IE 6 で確実に指定できるフォーマットは Text のみです。
 
戻り値

文字列

setData()NN なし IE 5(Win) DOM なし

setData(dataFormat, stringData)

dataTransfer オブジェクトにデータを格納します。データの格納に成功すると、ブール値 true を返します。

 
パラメータ
 
  • 読み出すデータのフォーマットを指定する文字列。当初は、複数のデータタイプに対応する予定でしたが、未対応のままです。IE 6 で確実に指定できるフォーマットは Text のみです。このメソッドでは URL もフォーマットとして許容されていますが、URL フォーマットでの設定値の読み取りはうまく機能しません。
  • HTML タグを示す文字列など、すべての文字列
 
戻り値

true または false のブール値