jQuery Sortable/Draggable 列表 disableselection() 不工作

Question

我将 HTML5 Sortable 用于可排序和可拖动列表。

问题

我正在使用 jQuery disableSelection() 来禁用列表从右向左移动。那是行不通的。有没有其他方法可以避免列表从右向左移动。

HTML

<section>
        <h1>Sortable Lists</h1>
        <ul id="sortable1" class="connected sortable list">
            <li draggable="true">Item 1
            </li><li draggable="true">Item 3
            </li><li draggable="true" class="" style="display: list-item;">Item 2
            </li><li draggable="true">Item 4
            </li><li draggable="true">Item 5
            </li><li draggable="true">Item 6
        </li></ul>
        <ul id="sortable2" class="connected sortable list">
            <li class="highlight" draggable="true">Item 1
            </li><li class="highlight" draggable="true" style="display: list-item;">Item 2
            </li><li class="highlight" draggable="true">Item 3
            </li><li class="highlight" draggable="true">Item 4
            </li><li class="highlight" draggable="true">Item 5
            </li><li class="highlight" draggable="true">Item 6
        </li></ul>
    </section>

jQuery

$(function () {
       $(".connected").sortable({
           connectWith: ".connected"
        }).disableSelection();
});

Fiddle

我已经把代码放在Fiddle

Answer 1

Use #id instead of .ClassName add one more disableSelection() method for Partiular #id

 $(function () {

   $("#sortable1").sortable({
       connectWith: "#sortable2"
    }).disableSelection();

    $("#sortable2").sortable({
    }).disableSelection();

});

已更新Fiddle Here