DHTML Methods
Specifies what data format to retrieve from the system clipboard through the dataTransfer object.
sRetrieveData = window.dataTransfer.getData (
sDataFormat )
| sDataFormat |
Required. Represents the data format that the drop target should read from the system clipboard using the dataTransfer object. This string value can be one of the following:
| Text |
Specifies that the data being transferred is text. |
| URL |
Specifies that the data being transferred is a URL. | |
String. Represents the data in the format retrieved from the dataTransfer object. Depending on what information setData contains, this variable can retrieve a path to an image, actual text, or an anchor URL.
The getData method enforces cross-frame security and allows data transfers within the same domain only. To the user, this means that dragging a selection between different security protocols, HTTP to HTTPs, will fail. Dragging a selection between two instances of the browser where the first instance has its security level set to medium and the second has it set to high will also fail. Finally, dragging a selection from another drag-enabled application, such as Microsoft® Word, into the browser will fail.
The following example shows how to use getData to drop text in a new location.
<script>
var sUseData;
function initDrag ( ) {
window.dataTransfer.setData ( "Text",
theSource.innerText );
}
function endDrag ( ) {
sUseData = window.dataTransfer.getData ( "Text" );
theTarget.innerText = sUseData;
}
</script>
<body>
<div align="center>
<b id="theSource" ondragstart="initDrag ( )">
select and drag this text</b>
<span id="theTarget" ondragenter="endDrag ( )"
style="background:gray">drop the text here</span>
</div>
</body>
Show me
The following example illustrates how to create a desktop shortcut.
<script language="JavaScript">
// This code relates to the dataTransfer example
var sAnchorURL;
function initDrag ( ) {
// The setData parameters tell the source object
// to transfer data as a URL and provide the path.
window.dataTransfer.setData ( "URL", theSource.href );
}
function endDrag ( ) {
// The parameter passed to getData tells the
// target object what data format to expect.
sAnchorURL = window.dataTransfer.getData ( "URL" );
theTarget.innerText = sAnchorURL;
}
</script>
<body>
<div align="center">
<a id="theSource" href="example"
onclick="return ( false )" ondragstart="initDrag ( )">
Test Anchor</a>
<span id="theTarget" ondragenter="endDrag ( )"
style="background:teal">Drop the Link Here</span>
</div>
</body>
Show me
dataTransfer
Data Transfer Overview, clearData, setData