Question

我已将事件绑定到不同的元素，当我在除Firefox之外的所有浏览器中拖动它时，它按预期工作。但是，在Firefox中，它根本不起作用。触发的唯一事件是dragstart，并且没有其他事件触发。发生了什么事？

Answer 1

Firefox要求用户在事件中运行dataTransfer.setData函数。

对于jQuery个用户，这意味着以下代码可以解决您的问题：

function dragstartHandler(event){

  event.originalEvent.dataTransfer.setData('text/plain', 'anything');

}

同一拖动的未来事件现在将按预期正常启动。显然，您可以用更有用的数据替换setData参数。

Answer 2

我没有使用jQuery，因此删除了originalEvent部分并将格式更改为文本（或IE有问题），并且它可以工作：

event.dataTransfer.setData('text', 'anything');

在drop事件中，请务必致电：

event.preventDefault();

或者它会跳转到anything.com。

Answer 3

使用某些鼠标事件时，FF存在长期存在的问题，这些事件源自溢出设置为自动或滚动的元素。

在我的情况下，我有一个很好用的拖放库，在样本和我的应用程序中完美地运行在每个浏览器上但是firefox。在深入了解与此相关的门票后，我找到了一个解决方案，我完全赞同这张票的贡献者https://bugzilla.mozilla.org/show_bug.cgi?id=339293

即设定 -moz-user-select：none

在被拖动的滚动元素上。它解决了我的特殊问题。

Answer 4

您可以将此作为此问题解决方案的参考，以解决在Firefox上发生的重定向问题。

您需要阻止drop方法中的默认操作来解决此问题。

function drop(e) {
    if(e.preventDefault) { e.preventDefault(); }
    if(e.stopPropagation) { e.stopPropagation(); }

    //your code here

    return false;
}

我从this link得到了这个解决方案。

Answer 5

使用此

IE：

event.dataTransfer.setData('text', '');

Firefox：

event.dataTransfer.setData('text/plain', '');

为什么HTML5拖放不在Firefox中工作？

5 个答案: