Javascript 按下shift键时，JS限制鼠标与轴的移动（对于可拖动元素）

当按下shift键时，我希望用户只能严格地上/下或左/右移动鼠标。 我目前的大致想法是在按下shift键时截取所有移动，并使用事件模拟进一步传递所需的事件（只包含所需的轴移动）。 我使用jQuery Draggable，所以另一个想法是确定何时按下shift键并限制Draggable本身，但这可能需要研究Draggable代码，并且可能很耗时。

---

如何以更优雅的方式实现这一点？

通过应用可拖动限制（仅在FF中测试）解决：

函数applyDragRestriction（事件，前置位置）{
如果（$（“.componentPlaced”）.draggable（“选项”、“轴”）返回；
if（Math.abs（event.clientX-prevPosition.x）

通过应用可拖动限制解决（仅在FF中测试）：

函数applyDragRestriction（事件，前置位置）{
如果（$（“.componentPlaced”）.draggable（“选项”、“轴”）返回；
if（Math.abs（event.clientX-prevPosition.x）

当您同时使用可排序插件时，您知道如何做到这一点吗？Sortable以某种方式覆盖了axis限制当您同时使用Sortable插件时，您知道如何实现这一点吗？Sortable以某种方式覆盖轴限制

     function applyDragRestriction(event, prevPosition) {
            if ($( ".componentPlaced" ).draggable( "option", "axis" )) return;
            if (Math.abs(event.clientX - prevPosition.x) < Math.abs(event.clientY - prevPosition.y)) {
                $('.componentPlaced').draggable({ axis: 'y' });
            } else {
                $('.componentPlaced').draggable({ axis: 'x' });
            }
        }

    function applyShiftHandler(event) {
        if (isShiftDown) applyDragRestriction(event, oldMousePositions);
        oldMousePositions = {x: event.clientX, y: event.clientY};
    }

    function checkShiftDown(event) {
        if (event.keyCode == KeyEvent.DOM_VK_SHIFT) {
           isShiftDown = true;
        }
    }

    function checkShiftUp(event) {
        if (event.keyCode == KeyEvent.DOM_VK_SHIFT) {
            cancelDragRestriction();
            isShiftDown = false;
        }
    }

function cancelDragRestriction() {
    $('.componentPlaced').draggable({ axis: null });
}