ondragstart 事件在vue中的用法

6,193 阅读1分钟

实现拖拽需要三个事件

1、拖拽开始

@dragstart方法是拖拽开始(按下鼠标有拖拽动作)

2、拖拽结束

@dragend方法是拖拽结束 (拖拽动作结束松开鼠标)

3、拖拽后的区域

@dragenter方法


拖拽结束浏览器会打开新的标签页,解决办法:

 //禁止浏览器拖动图片打开新标签页的默认事件 
 document.ondragover = function (e) { e.preventDefault(); }; 

 补充:HTML禁止图片拖动

 //禁止浏览器拖动图片 
 var im = document.getElementsByTagName("img");
 for (var i = 0; i < im.length; i++) {  
   im[i].onmousedown = function(e) {  
    e.preventDefault(); 
   };
 }