JQuery UIの選択可能なプラグインで複数の項目を選択する

Question

Jquery UIの選択可能なプラグインで、大規模な表のグリッドの異なる部分で複数のセルを選択できます。通常、ある項目をクリックすると、ユーザーが修飾キーを押さない限り、他の項目の選択が解除されます。この現象はjQuery Selectable demoで確認できます。キーボードを使わずにマウスの上にある強調表示されたセルの選択を解除する方法を教えてください。

Answer 1

一つの可能​​な解決策：

<style> 
    #feedback { font-size: 1.4em; } 
    #selectable .ui-selecting { background: #FECA40; } 
    #selectable .ui-selected { background: #F39814; color: white; } 
    #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; } 
    #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; } 
</style> 
<script type="text/javascript"> 
    $(function() { 
     $("#selectable").bind("mousedown", function(e) { 
      e.metaKey = true; 
     }).selectable({ 
      stop: function() { 
       var result = $("#select-result").empty(); 
       $(".ui-selected", this).each(function() { 
        var index = $("#selectable li").index(this); 
        result.append(" #" + (index + 1)); 
       }); 
      } 
     }); 
    }); 
</script> 

<p id="feedback"> 
    <span>You've selected:</span> <span id="select-result">none</span>. 
</p> 

<ol id="selectable"> 
    <li class="ui-widget-content">Item 1</li> 
    <li class="ui-widget-content">Item 2</li> 
    <li class="ui-widget-content">Item 3</li> 
    <li class="ui-widget-content">Item 4</li> 
    <li class="ui-widget-content">Item 5</li> 
    <li class="ui-widget-content">Item 6</li> 
</ol>