Javascript 使用HTML5本机拖放时如何限制移动？

各种JavaScript库，比如jQueryUI，都提供了拖放交互，您可以在其中将被拖动的元素拖放到单个轴上，或者在特定区域内

使用本机API可以实现这种功能吗？

完全不同！ jQuery UI拖放使元素在页面中移动（具有顶部和左侧CSS属性）

原生HTML5拖放API只允许您移动可拖动元素的“ghost”（当然，您可以在拖动ghost时隐藏原始元素）

---

API附带但没有，您无法约束鼠标位置，因此无法约束到单个轴（导致重影跟随鼠标位置，即使鼠标离开页面（但事件可能停止运行））.

链接到w3schools应该被视为重罪。我知道这是一篇旧文章的可能副本…但我解决了这个问题，在

dragstart

上创建了一个克隆元素，隐藏了原始内容，然后使用

dragover

事件设置克隆的位置-在该位置可以进行约束。与使用

mousemove

没有太大区别。这比完全重写拖放要容易得多，我相信很多人都这么做了。+1，我更新了从W3Schools到MDN的链接，以避免这成为问题的主题。我从未链接到W3Schools，那是编辑我问题的人。这个网站很蹩脚。