Javascript 拖放只能在一个方向上工作

我对Javascript中的拖放API有问题。 我有两个区域，一个叫做小部件，另一个叫做选择。现在我希望能够从一个区域拖放小部件。这已经起作用了，但仅当我将小部件拖动到选择面板时

当我想把它拖回小部件面板时。它不起作用。根据我的调试，从未调用dragstart事件。所有其他事件都有效，只有此事件似乎不会被触发

但是我找不到任何理由来解释为什么这个事件从未被触发

这是dragstart事件处理程序的代码：

`widget.on（'dragstart'，函数（e）{

`

我制作了一个JSFIDLE，您可以在其中找到完整的代码：

---

我自己找到了答案：

当元素更改其“位置”时，jQuery选择器

$（'.widget'）

不会收到通知

当您在上使用on方法时，您必须使用另一个选择器，如

document

，它会按预期工作，并在每个dragstart上触发事件

`$（document）.on（'dragstart'，'.widget'，函数（e）{ this.style.opacity='0.4'

    console.log('started');
    dragSrcEl = this;
    console.log(dragSrcEl);

    console.log(this.outerHTML);
    e.originalEvent.dataTransfer.effectAllowed = 'move';
    e.originalEvent.dataTransfer.setData('text/html', this.outerHTML);
});

`

    console.log('started');
    dragSrcEl = this;
    console.log(dragSrcEl);

    console.log(this.outerHTML);
    e.originalEvent.dataTransfer.effectAllowed = 'move';
    e.originalEvent.dataTransfer.setData('text/html', this.outerHTML);
});