到目前为止,我已经设法实现了一个简单的拖放功能。它允许用户将图像从一个 div 拖到另一个 div 中。这是代码:
<!DOCTYPE html>
<html>
<head>
<title> The New Dashboard </title>
<style>
#div1 {width:1000px;height:500px;padding:10px;border:1px solid #aaaaaa;}
#top {width:1000px;height:100px;padding:10px;border:1px solid #aaaaaa}
</style>
<script>
function allowDrop(ev){
ev.preventDefault();
}
function drag(ev){
ev.dataTransfer.setData("text", ev.target.id);
}
function drop(ev){
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
<div id = "top" ondrop="drop(event)" ondragover="allowDrop(event">
<img id = "drag1" src="slwheel.png" draggable="true" ondragstart="drag(event)">
</div>
<div id = "div1" ondrop="drop(event)" ondragover="allowDrop(event)">
</div>
</body>
</html>
现在我想将 slwheel 图像从其在#div1 div 中的新位置拖回#top div,但它不允许我这样做。我究竟做错了什么?任何帮助都将不胜感激。谢谢!
最佳答案
在 allowDrop(event) 中你错过了 )
关于javascript - HTML & CSS : Dragging and drop in multiple directions,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30580951/