拖动时更改光标

Question

在拖动时更改光标是否可能？

我已经搜索并尝试了一段时间。我想要更改“不允许”光标，该光标显示为您将对象拖到另一个光标时出现。

我尝试创建事件并将其分配给我想要拖动的图像：

<img id="drag1" class="drag" src="http://www.surfixe.com/img/tick2.png" draggable="true" ondragstart="drag(event)" />

JavaScript：-

function drag(ev) {
    $('#drag1').css('cursor', 'pointer');
}

jsfiddle

编辑说明：我的小项目应该是html-5的“拖放”，因此我需要在拖动具有html-5“drag”属性的div时能够更改光标。

- Surfine

---

我有同样的问题。你找到任何解决方案了吗？这是一个重复的链接https://dev59.com/5mUp5IYBdhLWcg3w8LB4 - Ricky Jiao

Answer 1

'not-allowed'鼠标光标只是表示根本没有可拖动的内容。您需要使用.draggable()方法将图像绑定http://api.jqueryui.com/draggable/，它具有在拖动时使用特定光标的选项。

您可以像这样轻松使用它：

$( "#drag1" ).draggable({ cursor: "pointer" });

http://jsfiddle.net/wpcbM/3/

- john Smith

---

不完全是我想要的，但你能给我一个jQuery UI的链接吗？ - Surfine

啊，好的。我知道你没有使用jQueryUI，据我所知，jQuery本身并不提供可拖动的功能，但是你可以轻松地自己构建它。参考链接：https://dev59.com/Q2oy5IYBdhLWcg3wa9Uj - john Smith

顺便提一下，在“over”和“out”方法（您希望动态操作它们的事件）上不起作用。 - Roman Pokrovskij

Answer 2

是的，这是可能的。您应该更改正在拖动的项目的光标（而不是目标项目的光标）。

- Roman Pokrovskij

---

他已经将样式应用到了拖动的元素上。而且，使用原生的HTML5拖放功能，仅仅通过改变拖动元素的光标是无法实现的。 - H27studio

是的，你说得对，作者已经在可拖动元素上应用了 CSS，我漏看了。我使用 jQuery UI 的可拖动功能时，通过 "helper" 属性，在鼠标悬停在禁止区域时将光标设置为 "nodrop"。似乎 jQuery 可拖动功能中的 helper 属性组织方式并不简单。 - Roman Pokrovskij

可能在 jQuery UI Draggable 中，helper 是一个绑定到 mousemove 的带有绝对定位的普通元素，这就是为什么它对我有效的原因。 - Roman Pokrovskij