javascript - JavaScript 中的战舰游戏 - 尝试拖动和选择船只时出现奇怪的光标行为（不允许放置/不允许）

Question

我一直在制作战舰游戏，但发生了一件奇怪的事情，而且无法重现。有时，当我尝试拖动和选择船舶时，我的光标会变成不允许放置/不允许的图标，并且不允许我在网格上选择多个字段。示例 - https://snipboard.io/YmDtIh.jpg. 此外，似乎网格上的字段（我已经使用脚本实现了 100 个具有 id 和自定义 CSS 定位的游戏板容器内的 div）被光标“抬起”，好像浏览器认为我想移动整个游戏板容器，而不是为船选择字段。对于拖动和选择，我创建了两个事件侦听器 - onmousedown 来确定选择的开始，而 onmouseup 更复杂，除了跟踪鼠标释放的位置之外，还可以验证选择是否正常（例如，我放置如果用户尝试在一行/列中选择超过 4 个字段，则会发出警报，因为最大的船有 4 个字段长。有人知道这种奇怪的光标行为背后的原因吗？它发生在 Chrome 和 Firefox 中。

标签： javascriptselectcursordragevent-listener