DataTransferItem.getAsFile()

这篇翻译不完整。请帮忙从英语翻译这篇文章

如果DataTransferItem是一个文件, 那 DataTransferItem.getAsFile()  方法将返回拖拽项数据的 File 对象. 如果拖拽项的数据不是一个文件,则返回 null.

语法

File = DataTransferItem.getAsFile();

参数

无.

返回值

File
如果拖拽项的对象是一个文件, 则返回 File 对象; 否则返回 null .

例子

下面这个例子中使用 getAsFile() 。放在 drop 事件处理里面.

function drop_handler(ev) {
 console.log("Drop");
 ev.preventDefault();
 var data = event.dataTransfer.items;
 for (var i = 0; i < data.length; i += 1) {
   if ((data[i].kind == 'string') && 
       (data[i].type.match('^text/plain'))) {
     // 遍历拖拽项的内容
     data[i].getAsString(function (s){
       ev.target.appendChild(document.getElementById(s)); 
     });
   } else if ((data[i].kind == 'string') && 
              (data[i].type.match('^text/html'))) {
     // 拖拽项的数据是 HTML
     console.log("... Drop: HTML");
   } else if ((data[i].kind == 'string') && 
              (data[i].type.match('^text/uri-list'))) {
     // 拖拽项的数据是URI
     console.log("... Drop: URI");
   } else if ((data[i].kind == 'file') && 
              (data[i].type.match('^image/'))) {
     // 拖拽项的数据是一个图片
     var f = data[i].getAsFile();
     console.log("... Drop: File ");
   }
 }
}

规范

Specification Status Comment
HTML Living Standard
getAsFile()
Living Standard Initial value
HTML 5.1
getAsFile()
Recommendation Snapshot of the HTML WHATWG document

浏览器兼容

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic supportChrome Full support 4Edge Full support YesFirefox Full support 50IE No support NoOpera Full support 12Safari No support NoWebView Android Full support YesChrome Android Full support YesEdge Mobile ? Firefox Android Full support 50Opera Android No support NoSafari iOS No support NoSamsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown

查看更多

文档标签和贡献者

标签: 
此页面的贡献者: ty4z2008
最后编辑者: ty4z2008,