DataTransfer.getData()
方法接受指定类型的拖放(以DOMString
的形式)数据。如果拖放行为没有操作任何数据,会返回一个空字符串。
数据类型有:text/plain
,text/uri-list。
语法
DOMString dataTransfer.getData(format);
参数
- format
DOMString
类型
返回值
示例
这个例子展示了 DataTransfer
对象的getData()
和setData()
方法。
HTML Content
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"> <span id="drag" draggable="true" ondragstart="drag(event)">drag me to the other box</span> </div> <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
CSS Content
#div1, #div2 { width:100px; height:50px; padding:10px; border:1px solid #aaaaaa; }
JavaScript Content
function allowDrop(allowdropevent) { allowdropevent.target.style.color = 'blue'; allowdropevent.preventDefault(); } function drag(dragevent) { dragevent.dataTransfer.setData("text", dragevent.target.id); dragevent.target.style.color = 'green'; } function drop(dropevent) { dropevent.preventDefault(); var data = dropevent.dataTransfer.getData("text"); dropevent.target.appendChild(document.getElementById(data)); document.getElementById("drag").style.color = 'black'; }
结果
说明
Specification | Status | Comment |
---|---|---|
HTML Living Standard getData() |
Living Standard | |
HTML 5.1 getData() |
Recommendation | Initial definition |
兼容性
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!
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support | 4 | (Yes) | 3.5 [1] | 10 (10) | 12 | 3.1 |
Feature | Android | Android Webview | Chrome for Android | Edge | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|---|---|
Basic support | 未实现 | 未实现 | 未实现 | (Yes) | 10.0 (10)[1] | 未实现 | 10 | 未实现 | 未实现 |
[1] 在Firefox 48之前,如果指定的MIME类型不合法,这个方法返回的是一个空数组。