js文件拖拽操作

dragenter
当外界有一些拖拽的东西进入到元素区域时触发事件

ele.addEventListener('dragenter')

dragenter
拖拽离开事件

ele.addEventListener('dragleave')

dragover
如果想要捕获drop事件,就一定得在该事件中阻止默认事件
当拖拽一些东西放到元素区域时触发事件

ele.addEventListener('dragover',function(){
    e.preventDefault();
    e.stopProagation()
})

dragenter
当拖拽一些东西放到元素区域时触发事件

ele.addEventListener('drop',function(e){
     e.dataTransfer.getData('text/plain')  //获取文本内容
     e.dataTransfer.getData('text/uri-list')  //图片获取链接地址
})
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 之前写过一篇浏览器事件的相关操作和事件运行的原理——JavaScript浏览器事件解析。这一篇主要写一些常用的事件...
    faremax阅读 1,668评论 0 0
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,954评论 25 709
  • H5 meta详解 viewport width:控制 viewport 的大小,可以指定的一个值,如果 600,...
    FConfidence阅读 845评论 0 3
  • 昨天,师弟发了一条朋友圈,抱怨现在的女人真现实,宁愿在宝马车上哭,也不愿在自行车上笑。 这师弟为人挺老实的,就是家...
    赖雄伟阅读 737评论 0 0
  • 程序猿基础知识的学习、理解、整理——事务(方方土) 什么是XA事务?在什么场景下会出现XA事务? @Transac...
    方方土阅读 1,082评论 1 1