拖动元素时不能改变光标

Can't change cursor while dragging over an element

本文关键字:能改变 光标 不能 元素 拖动      更新时间:2023-09-26

我想将光标更改为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/

演示还包含第二个(橙色)元素,用于显示光标的外观。

为什么不工作?

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

希望能给你一些帮助。