javascript - 如何阻止可拖动对象恢复到原始位置

我在Angular 4中创建了自己的自定义材质设计滑块，并且遇到了这样的情况：如果我拖动滑块，滑块会移动，但在mouseup上，它将恢复到原始位置。

我阅读了dragEvents，但是由于可放置区域是我拖动的对象，因此似乎无法找到一种解决方案以使其停止还原到原始位置。

您可以使用此url复制此行为，因为它足以使页面变长

https://stackblitz.com/edit/angular-1ndu2t

最佳答案

添加一个Dragend处理程序将解决此问题：

    this.slider.addEventListener('dragend', this.onDrag.bind(this), false);

将日志添加到事件侦听器时，松开鼠标会看到x（和y）为负，但是因为dragend会给出正确的值作为最后一个，因此可以解决此问题：

onDrag(event: DragEvent) {
  console.log(event.x);
  this.updateValueFromPosition({ x: event.x, y: event.y });
}

关于javascript - 如何阻止可拖动对象恢复到原始位置，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/46741919/