エスケープキーでドラッグをキャンセルする方法

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と呼び出しは：

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