html5拖拽文件上传需阻止默认事件

至少阻止下列3个事件的默认行为才能实现文件拖拽上传

复制代码
var b=document.getElementById('box')
b.ondragenter=(e)=>{
  e.preventDefault()
  console.log('======aaa',e.dataTransfer.files);
}
b.ondragover=(e)=>{
  e.preventDefault()
  console.log('======bb',e.dataTransfer.files);
}

b.ondrop=(e)=>{
  e.preventDefault()
  console.log('======e',e.dataTransfer.files);
}

参考

文件上传方式之拖拽上传【渡一教育】_哔哩哔哩_bilibili

相关推荐
Zero1017131 小时前
【详解pnpm、npm、yarn区别】
前端·react.js·前端框架
&白帝&2 小时前
vue右键显示菜单
前端·javascript·vue.js
Wannaer2 小时前
从 Vue3 回望 Vue2:事件总线的前世今生
前端·javascript·vue.js
羽球知道2 小时前
在Spark搭建YARN
前端·javascript·ajax
光影少年2 小时前
vue中,created和mounted两个钩子之间调用时差值受什么影响
前端·javascript·vue.js
青苔猿猿2 小时前
node版本.node版本、npm版本和pnpm版本对应
前端·npm·node.js·pnpm
一只码代码的章鱼3 小时前
Spring的 @Validate注解详细分析
前端·spring boot·算法
zimoyin4 小时前
Kotlin 协程实战:实现异步值加载委托,对值进行异步懒初始化
java·前端·kotlin
cdcdhj4 小时前
vue用通过npm的webpack打包编译,这样更适合灵活配置的项目
vue.js·webpack·npm
恋猫de小郭4 小时前
如何查看项目是否支持最新 Android 16K Page Size 一文汇总
android·开发语言·javascript·kotlin