javascript - 追加新元素后，jQuery UI 可排序刷新不起作用

Question

因此，一旦我附加了一个新的元素列表，它们就不再是可排序的。我试过使用 sortable("refresh") 但它仍然不起作用。

$(function() {
    $(".test").on('click', function(event) {
      $(this).parent().append('<ul class="sortList"><li>123</li></ul>');
      $(".sortList").sortable('refresh');
    })

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

这是一个 jsfiddle http://jsfiddle.net/6nL0rm1a/5/显示我的问题。如您所见，如果单击该按钮，则会添加一个新列表。但是您不能对其项目进行排序/拖放到其他列表。

我希望附加列表的项目是可拖放的。也可排序。

标签： javascriptjqueryjquery-ui

Answer 1

第一次尝试，添加列表时添加排序。

  $(function() {
    $(".test").on('click', function(event)      
     {
            $(this).parent().append('<ul class="sortList"><li>123</li></ul>').children().sortable({
        connectWith: ".sortList"
    }).disableSelection();
    })

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