0

我一直在尝试将有关此主题的各种 SO 答案拼凑在一起，但我无法弄清楚。这个答案显示了如何选择多个项目，但我不知道如何添加按下 shift 键的条件。

拖动多个项目会选择所有项目，这很棒。单击单个项目会选择该项目，这很棒。但是如果按下 shift 键，单击多个项目应该将它们全部选中，再次单击它们应该取消选中它们。

这是一个小提琴。

HTML

<div id="canvas">
    <div class="elemContainer ui-selected" style="position: absolute; top: 50px;
    left: 50px; width: 100px; height: 100px;">     
        <div class="elem" style="position: absolute; width: 100%; height: 100%; 
        background: pink;"></div>
    </div>

     <div class="elemContainer ui-selected" style="position: absolute; top: 50px;
    left: 50px; width: 100px; height: 100px;">     
        <div class="elem" style="position: absolute; width: 100%; height: 100%; 
        background:  coral;"></div>
    </div>
</div>

Javascript

$('#canvas').selectable();

$('.elemContainer').draggable();

// Fix single click selection
$(".elemContainer").click(function() {
    if (!$(this).hasClass("ui-selected")) {
        $(this).addClass("ui-selected").siblings().removeClass("ui-selected");
    }
})
4

1 回答 1

1

看到这个更新的小提琴：http: //jsfiddle.net/5ayrW/7/

.click(function(e) {
 if (e.shiftKey) {

click 和 shift+click 现在都调用了一个向自身或兄弟姐妹添加类的函数。

于 2013-11-04T12:02:31.353 回答