拖放时更改鼠标光标答案

【问题标题】：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 感谢您的宝贵时间。我猜开发工具会产生问题，请参阅编辑。

标签： javascript dom mouse-cursor

【解决方案1】：

我无法重现您的问题，但我遇到了以下链接，该链接还表明除 Firefox 之外的所有浏览器都存在错误。这是一个旧链接，但可能会有所帮助。

https://github.com/RubaXa/Sortable/issues/246

【讨论】：