www.fgks.org   »   [go: up one dir, main page]

Click to Rate and Give Feedback
 dataTransfer Object
dataTransfer Object

Provides access to predefined clipboard formats for use in drag-and-drop operations.

Members Table

The following table lists the members exposed by the dataTransfer object.

Attributes/Properties
Show:
PropertyDescription
dropEffect Sets or gets the type of drag-and-drop operation and the type of cursor to display.
effectAllowed Sets or gets which data transfer operations are allowed for the object on the source element.
MethodDescription
clearData Removes one or more data formats from the clipboard through the dataTransfer object or the clipboardData object.
getData Gets the data in the specified format from the clipboard through the dataTransfer object or the clipboardData object.
setData Assigns data in a specified format to the dataTransfer object or the clipboardData object.

Remarks

The dataTransfer object makes it possible to customize the handling of drag-and-drop operations. It is available through the event object.

The dataTransfer object is used in source and target events. Typically, the setData method is used with source events to provide information about the data being transferred. In contrast, the getData method is used with target events to stipulate which data and data formats to retrieve.

This object is available in script as of Microsoft Internet Explorer 5.

Example

This example uses the setData and getData methods of the dataTransfer object to perform a drag-and-drop operation.

<head>
<script>
var sAnchorURL;

function InitiateDrag() 
/*  The setData parameters tell the source object
    to transfer data as a URL and provide the path.  */
{   
    event.dataTransfer.setData("URL", oSource.href);
}

function FinishDrag()
/*  The parameter passed to getData tells the target
    object what data format to expect.  */
{
    sAnchorURL = event.dataTransfer.getData("URL")
    oTarget.innerText = sAnchorURL;
}
</script>
</head>

<body>

<a id="oSource" href="about:Example_Complete" 
    >Test Anchor</a> 
<span id="oTarget" >Drop the Link Here</span>

</body>
This feature requires Microsoft® Internet Explorer 5 or later. Click the following icon to install the latest version. Then reload this page to view the sample.

Standards Information

There is no public standard that applies to this object.

Applies To

event
Tags What's this?: Add a tag
Community Content
 
Add Community Content
© 2008 Microsoft Corporation. All rights reserved. Terms of Use  |  Trademarks  |  Privacy Statement
Page view tracker
DCSIMG