Question

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

当我想将其拖回小部件面板时。这是行不通的。根据我的调试，永远不会调用 dragstart 事件。所有其他事件都有效，只有这个事件似乎没有被解雇。

但是我找不到任何理由为什么这个事件永远不会被解雇。

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

`widget.on（'dragstart'，function（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);
    });

`

我已经制作了一个jsFiddle，你可以找到整个代码：

http://jsfiddle.net/3FLaS/

Answer 1

我自己找到了答案：

当元素更改其“位置”时，jQuery选择器$('.widget')不会收到通知。

你必须使用其他选择器，如document，当你使用on方法时，它按预期工作，并在每个dragstart触发事件。

`$（document）.on（'dragstart'，'。widget'，function（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);
});

`

拖放仅在一个方向上起作用

1 个答案: