为了账号安全,请及时绑定邮箱和手机立即绑定

如何获取拖动文件的文件名(放置之前)

如何获取拖动文件的文件名(放置之前)

森栏 2023-08-24 10:23:50
我想获取从浏览器外部拖动的文件的文件扩展名。我知道您可以在ondrop事件中访问文件名,但我想根据用户在删除文件之前拖入我的应用程序的文件类型做出反应。必须有某种方法,因为 Webflow(一个用于构建响应式网站的 Web 应用程序)正在这样做。根据文件类型,它会为您提供不同类型的元素。我感谢每一个朝着正确方向前进的小引导
查看完整描述

1 回答

?
富国沪深

TA贡献1790条经验 获得超9个赞

如果您在拖拽事件期间需要它,您唯一的选择是 MIME 类型,可以使用 检索它event.dataTransfer.items[n].type。文件的其余信息在 drop 事件发生之前无法访问。

请注意此功能的浏览器兼容性,因为 Internet Explorer 和 Safari 都不支持此功能。

var dropReceiver = document.getElementById("dropReceiver");


dropReceiver.addEventListener('dragover', function(e) {

    e.stopPropagation();

    e.preventDefault();

    e.dataTransfer.dropEffect = 'copy';

    

    for(var i = 0; i < e.dataTransfer.items.length; i++)

    {

        console.log(e.dataTransfer.items[i].type);

    }

});

#dropReceiver

{

padding: 100px 120px;

background: blue;

color: white;

font-size: 30px;

text-align: center;

}

<div id="dropReceiver">Drag On Me</div>


查看完整回答
反对 回复 2023-08-24
  • 1 回答
  • 0 关注
  • 89 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信