Question

在HTML5中，我有2个<section> s（2个框）：

<section  id="leftbox">
  Drag an image here!
</section>

<section id="rightbox">
  <img id="pic" src="images/img1.jpg">
</section>

我想使用JS在2个盒子之间移动图像。我有以下几点：

leftbox.addEventListener("dragenter", dragenter, false);
leftbox.addEventListener("dragleave", dragleave, false);
leftbox.addEventListener("dragover", function(e){e.preventDefault();}, false);
leftbox.addEventListener("drop", dropped , false);

rightbox.addEventListener("dragenter", dragenter, false);
rightbox.addEventListener("dragleave", dragleave, false);
rightbox.addEventListener("dragover", function(e){e.preventDefault();}, false);
rightbox.addEventListener("drop", dropped , false);

例如，当我在功能＆＃34;拖动＆＃34;时，如何知道图像是来自右侧还是左侧？

Answer 1

您可以简单地使用被拖动元素的parentNode属性，例如

 var origin = document.getElementById(data).parentNode /* where data is the id
 of element being dragged.` which is set in the dataTransfer object of the event.*/

JSFiddle Demo

Answer 2

我不完全理解你的问题，但我想你想检查你拖动的物品是从右边还是左边开始!!

然后你应该这样做：

当dragenter然后将data attribute添加到从特定框中拖出的元素时，使用类似$(this).parent()的内容并定义拖动项目的attribute其他框ID是right或left的权利！如果您不想定义右侧或左侧，请获取offsetLeft。

这可以帮助你.. 如果您提供fiddle，则很容易这样做..

我怎么知道发生了什么事？

2 个答案: