美文网首页
js文件拖拽操作

js文件拖拽操作

作者: angelwgh | 来源:发表于2017-06-13 08:47 被阅读0次

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')  //图片获取链接地址
})

相关文章

  • js文件拖拽操作

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

  • 原生拖拽,拖放事件(drag and drop)

    拖拽,拖放事件可以通过拖拽实现数据传递,达到良好的交互效果,如:从操作系统拖拽文件实现文件选择,拖拽实现元素布局的...

  • js:拖拽事件

    拖拽事件 ondragstart当拖拽元素被开始拖拽时,event:拖拽元素。[从操作系统向浏览器拖拽文件不会触发...

  • PYQT5 (十八)文件拖放(drag and drop)并获取

    通过重写QScrollArea 类实现的文件拖拽操作

  • Xcode编译WebApps找不到js的错误解决办法

    解决的办法:将Targets ->Build Phases-> Compile Sources 中的js文件拖拽到...

  • 文件拖拽

    文件拖拽ondragover 拖拽文件进入窗口 (不断执行)ondragenter 拖拽文件进入窗口 ...

  • 实现可拖拽插件

    一、js拖拽插件的原理常见的拖拽操作是什么样的呢?整过过程大概有下面几个步骤: 1、用鼠标点击被拖拽的元素 2、按...

  • 2018-06-16ps学习第一天笔记

    一,PS基本操作 1,打开: (1)文件(菜单)----打开 (2)拖拽法:把图片拖拽到属性栏后面的空白处 2,关...

  • js拖拽html元素工具类

    复制就能用的拖拽js方法 原生js实现拖拽元素方法 使用(注意拖拽目标元素需绝对定位 position: 'abs...

  • 拖拽

    一、JS拖拽JS里拖拽三事件, onmousedown onmousemove onmouseup 是实现交互性效...

网友评论

      本文标题:js文件拖拽操作

      本文链接:https://www.haomeiwen.com/subject/nxmrqxtx.html