<!DOCTYPE html> <html> <head lang="en"> <title></title> <meta charset="utf-8"> </head> <body> <a href="00_显示_隐藏切换.html">隐藏切换页面</a> <img src="../resource/1.jpg" draggable="true" id="img1"/> <script type="text/javascript"> var img1 = document.getElementById("img1"); img1.ondragstart = function(evt){ evt.dataTransfer.setData("text/plan","www.baidu.com"); } document.ondragover = function(evt){ //取消事件的默认行为 return false; } document.ondrop = function(evt){ img1.style.position = "absolute"; img1.style.left = evt.pageY+"px"; //取消事件默认行为 return false; } </script> </body> </html> <!-- 1 将需要拖动的元素的 draggable 属性设置为 true 2 为拖动的元素设置监听器 -->
HTML5中文件的拖放支持还是略显复杂，js框架应该会有更好的解决方案