Javascript draggable我需要引用初始被拖动的对象，以便交换

我需要的功能是当您拖动一个元素并将其放到另一个元素上时，它们会交换位置

我想写一个这样的交换函数

function swapElements(obj1, obj2) {
    // create marker element and insert it where obj1 is
    var temp = document.createElement("div");
    obj1.parentNode.insertBefore(temp, obj1);

    // move obj1 to right before obj2
    obj2.parentNode.insertBefore(obj1, obj2);

    // move obj2 to right before where obj1 used to be
    temp.parentNode.insertBefore(obj2, temp);

    // remove temporary marker node
    temp.parentNode.removeChild(temp);
}

作为参数，我需要传递初始拖拽元素，然后在

drop

上传递被拖拽的元素

  var self = this;

  // drag start
  myNode.addEventListener("dragstart", function(e) {
    this.classList.add('dragstart');
    e.dataTransfer.setData('from', this.innerHTML);
  }, false);

  // drop event
  myNode.addEventListener("drop", function(e) {
    if (e.preventDefault) e.preventDefault(); 
    if (e.stopPropagation) e.stopPropagation();
    this.classList.remove('dragover');

    var obj1 = e.dataTransfer.getData('from');

    // user has dropped lets do the swap
    self.swapElements(obj1, this);

  }, false);

因此，在上面，我使用的是

dataTransfer

，但这实际上并不是引用初始节点，而是克隆HTML

---

因此，我的问题是如何引用初始拖动的节点，以便运行交换函数？

您可以对事件处理程序使用公共变量，并在其中存储正在拖动的元素

var dragged;

myNode.addEventListener("dragstart", function(e) {
    this.classList.add('dragstart');
    dragged=e.target;
  }, false);

 myNode.addEventListener("drop", function(e) {
    if (e.preventDefault) e.preventDefault(); 
    if (e.stopPropagation) e.stopPropagation();
    this.classList.remove('dragover');
    self.swapElements(dragged, e.target);

  }, false);

---

this.innerHTML

将以字符串形式返回元素的内容，而不是DOM节点。Bump？很抱歉，我不太明白：）我不确定这里的颠簸是否有效，我想可能是评论让帖子排在了第一位。我找到了一个解决方案，我刚刚将拖动元素附加到窗口。现在还可以，你可以添加一个赏金：）我尝试过使用这个策略，我只是再试了一次，但没有定义。在

drop上

它会消失。