概述
将文件拖放到页面上时,您可以通过 event.dataTransfer.files 获取文件,同时处理所有与拖放相关的事件。然后每个文件对象都有一个名称属性。
将文件粘贴到页面上时,您会在 onpaste 事件中通过 event.clipboardData.items (这不是一个数组或普通对象,但我离题了)获得“项目”。item 对象有一个 getAsFile() 方法,但这会返回一个 Blob,而不是 File,因此缺少 name 属性。
我正在尝试做的事情
我想获取文件名,以便以后上传图像时可以将其作为元数据与图像一起存储。
Chrome 只是有问题吗?
您可能会认为他们会为此目的重用 event.dataTransfer,但这是未定义的。您还可能认为 getAsFile() 会返回一个文件,但浏览器制造商再次决定反对显而易见的做法。以下是 getAsFile 应该做什么的规范:http: //www.w3.org/TR/html/editing.html#dom-datatransferitem-getasfile
先发制人一些不可避免的评论:
这一切至少在 Chrome 中是正确的。假设我现在只关心 Chrome,也许是最新版本的 Safari 和 Firefox。
我在其他地方的评论中看到,由于“明显的安全问题”,人们似乎认为浏览器“永远不会”允许复制/粘贴文件,但它们确实允许拖放文件,所以让我们跳过那个有缺陷的争论。
结论:
有什么方法可以获取粘贴文件的名称吗?这只是 Chrome 实现中的一个错误吗?
更新
我在 codepen 上创建了一支笔来演示这个问题:http ://codepen.io/lerouxb/pen/hiLux 看起来 Chrome 在这里也有问题,所以我提交了一个错误:https ://code.google.com/ p/chromium/issues/detail?id=361145