如何使用Escape键取消拖动

Question

请问，您是否知道如何使用退出按钮取消拖放并将拖动的项目恢复到原始位置？

我正在使用https://github.com/RubaXa/Sortable，代码为：

Sortable.create(shelf2, {
  animation: 200,
  group: {
    name: "shared",
    revertClone: true
  },
  sort: true,
  // Set the delay for the Drag&Drop effect
  delay: 1000,
  ghostClass: "sortable-ghost",
    chosenClass: "sortable-chosen"
});

以下是Codepen的完整示例：https://codepen.io/vlastapolach/pen/xreXpv

有什么想法吗？

Answer 1

通过切换到不同的库 - jQueryUI并调用其原生的Cancel方法解决了问题：

  $(document).keyup(function(e) {
    if (e.which === 27 || e.keyCode === 27) {
      $("#shelf1, #shelf2").sortable("cancel");
    }
  });
});