Html 为什么 HTML5 拖放在 Firefox 中不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19055264/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why doesn't HTML5 drag and drop work in Firefox?
提问by RandallB
I have bound events to different elements, and when I drag them in all browsers, except Firefox, it works as expected. In firefox, however, it doesn't work at all. The only event that fires is dragstart, and none of the other events fire. What's going on?
我已将事件绑定到不同的元素，当我在所有浏览器（Firefox 除外）中拖动它们时，它按预期工作。但是，在 Firefox 中，它根本不起作用。唯一触发的事件是dragstart，其他事件都不会触发。这是怎么回事？
采纳答案by Carson Holmes
I'm not using jQuery, so removed the originalEvent portion and changed the format to text (or IE had issue), and it works:
我没有使用 jQuery，所以删除了 originalEvent 部分并将格式更改为文本（或 IE 有问题），它可以工作：
event.dataTransfer.setData('text', 'anything');
In the drop event make sure to call:
在 drop 事件中确保调用：
event.preventDefault();
Or it will jump to anything.com.
或者它会跳转到anything.com。
回答by RandallB
Firefox requires that a user run the dataTransfer.setDatafunction in the event.
Firefox 要求用户dataTransfer.setData在事件中运行该函数。
For you jQueryusers, that means the following code should resolve your issue:
对于您的jQuery用户，这意味着以下代码应该可以解决您的问题：
function dragstartHandler(event){
event.originalEvent.dataTransfer.setData('text/plain', 'anything');
}
Future events on the same drag will now properly fire as you expected. Obviously you can replace the setDataarguments with more useful data.
同一阻力上的未来事件现在将按您的预期正确触发。显然，您可以setData用更有用的数据替换参数。
回答by user3795410
FF has long standing issues with eating certain mouse events that originate from elements that have overflow set to auto or scroll.
FF 在吃某些源自将溢出设置为自动或滚动的元素的鼠标事件方面存在长期问题。
In my case, I had a well used library for drag and drop that worked perfectly in the samples and in my app on every browser but firefox. After digging through the tickets related to this, I found a solution that I fully credit to a contributor to this ticket https://bugzilla.mozilla.org/show_bug.cgi?id=339293
就我而言，我有一个使用良好的拖放库，它在示例和我的应用程序中的每个浏览器中都能完美运行，但 Firefox 除外。在挖掘与此相关的票证后，我找到了一个解决方案，我完全归功于此票证的贡献者https://bugzilla.mozilla.org/show_bug.cgi?id=339293
which is to set -moz-user-select: none
这是设置 -moz-user-select: none
on the scrolled element being dragged from. It solved my particular problem.
在被拖动的滚动元素上。它解决了我的特殊问题。
回答by Akhilesh Sehgal
You can use this as a reference for this question solution regarding the redirects that occur on Firefox.
您可以将此作为有关 Firefox 上发生的重定向的问题解决方案的参考。
You need to prevent the default action in drop method to fix this issue.
您需要阻止 drop 方法中的默认操作来解决此问题。
function drop(e) {
if(e.preventDefault) { e.preventDefault(); }
if(e.stopPropagation) { e.stopPropagation(); }
//your code here
return false;
}
I got this solution from this link.
我从这个链接得到了这个解决方案。
回答by bafuka
use this
用这个
IE:
IE：
event.dataTransfer.setData('text', '');
Firefox:
火狐：
event.dataTransfer.setData('text/plain', '');
