拖放时更改鼠标光标
Posted
技术标签:
【中文标题】拖放时更改鼠标光标【英文标题】：Change Mouse Cursor While Drag and Drop 【发布时间】：2018-12-01 20:56:57 【问题描述】：我有一个 DOM 元素，我想将“项目”放入其中。我想通过更改光标图标给用户视觉反馈。但是当鼠标按钮被按住时，光标不会改变。如果我不移动鼠标按钮，它会改变。但当我按住按钮时不会。为什么？如何为用户实现所需的光标反馈？我正在使用谷歌浏览器。
<html>
<head>
<script type="text/javascript">
function Document()
var that = document.createElement("div");
that.style.backgroundColor = "#80ff80";
that.style.border = "1px solid black";
that.style.height = "90%";
that.style.width = "50%";
that.onmousemove = function (event)
//console.log(event.offsetX + ", " + event.offsetY);
if (Math.random() < 0.5)
that.style.cursor = "not-allowed";
else
that.style.cursor = "move";
return false;
return that;
function onLoadPage()
var doc = new Document();
document.body.appendChild(doc);
</script>
</head>
<body onload="onLoadPage()" />
</html>
1) 将鼠标移到 div 上。它会随机更改光标图标。 2) 按下鼠标按钮并将鼠标移到 div 上。它会保留最后一个图标，直到您释放鼠标按钮。
编辑： Chrome 的控制台可能会产生此问题。当我隐藏“开发人员工具”时，光标更改似乎效果很好。当我启用“开发工具”，将选项卡更改为任何选项卡并返回时，按住鼠标按钮光标不会改变。
【问题讨论】：
您是否将新创建的元素附加到 DOM 中？ 是的，当然。绿色的款式就是看看在哪里，试试看。 我can't reproduce这个问题..？ 好的。 Firefox 似乎没有这个问题。我正在使用 Chrome。 @Teemu 感谢您的宝贵时间。我猜开发工具会产生问题，请参阅编辑。 【参考方案1】：我无法重现您的问题，但我遇到了以下链接，该链接还表明除 Firefox 之外的所有浏览器都存在错误。这是一个旧链接，但可能会有所帮助。
https://github.com/RubaXa/Sortable/issues/246
【讨论】：
以上是关于拖放时更改鼠标光标的主要内容，如果未能解决你的问题，请参考以下文章