Jquery ui 无法将可拖动元素添加到选定的组

我这里有一个JSFIDLE——在一个容器中有三个可拖动的盒子，我已经选择了。我可以在两个框周围拖动一个矩形并选择它们，但不能按住CTRL键单击第三个框并选择它。这似乎是阻力处理程序的阻碍，因为如果从框中删除draggable（）（在jQuery中注释掉第35行），它工作得很好。有人知道我如何使用Ctrl-click选择第三个可拖动框吗

谢谢

<div id='container'>
    <div id="box1" class="box">1</div>
    <div id="box2" class="box">2</div>
    <div id="box3" class="box">3</div>
</div>

1.
2.
3.

不需要修改器Ctrl+：

$(function () {
    $('.box').draggable();
    $('#container').selectable({});
    $('.box').click(function (){
        $(this).addClass("ui-selected");
    });
});

但如果修改器关键点对您的案例很重要：

$(function () {
    $('.box').draggable();
    $('#container').selectable({});
    $('.box').click(function (e){
        if(e.metaKey){// might be ctrlKey, but metaKey is a Mac compatible 
            $(this).addClass("ui-selected");
        }
    });
});