拖动元素时无法更改光标答案

【问题标题】：Can't change cursor while dragging over an element拖动元素时无法更改光标
【发布时间】：2015-10-17 10:37:51
【问题描述】：

我想将光标更改为copy，同时将元素拖动到指定的可放置对象上。 我使用它通过拖放从本地文件系统上传文件到浏览器窗口。 我可以改变元素的外观，但光标不会改变。这是我正在使用的代码：

HTML

<div class="droppable"></div>

CSS

.droppable {
    width: 200px;
    height: 100px;
    background: red;
}

.droppable.active {
    background: green;
    cursor: copy;
}

JS

droppable = $('.droppable');

droppable.on('dragover dragenter', function(event) {
    droppable.addClass('active');
    event.preventDefault();
    event.stopPropagation();
});

droppable.on('dragleave', function(event) {
    droppable.removeClass('active');
    event.preventDefault();
    event.stopPropagation();
});

您可以在这里自己尝试：http://jsfiddle.net/27px4u5h/

该演示还包含第二个（橙色）元素，显示光标的外观。

为什么这不起作用？

【问题讨论】：

能贴出可拖动的代码吗？
@DimalChandrasiri 抱歉，我想从本地文件系统中删除文件。这就是我正在使用的所有代码。我将把它添加到问题中。
你应该为你的可拖动对象使用一个 id
@RachelGallen 您能否提供一些信息，为什么我应该使用 id？上课有什么问题？我也可能有多个这些元素。 :)
@lampshade 实际上没关系，只是你先调用另一个类 .active 但如果你只是要使用 :active 那么使用类而不是 id 是可以的，特别是如果你有多个实例

标签： javascript html css

【解决方案1】：

我已经在 Chrome 和 FF 中测试过你的代码。似乎 chrome 正在成功运行您的代码，但 FF 没有运行您的代码，这可能是由于某些限制或所需的支持资源，我不确定那个。

希望能给你一些帮助。

【讨论】：

您可以尝试另一个技巧，将一些文本放入 div 中，例如
ABC
并选择 ABC 并拖动它，然后您会看到拖动正在工作 FF