Question

我不希望ul的{{1}}是可排序的，如果其中有一个或多个具有类li的元素。怎么做到这一点？

Psuedo代码：

unsaved

修改

抱歉，我应该更清楚。在列表中应用sortable方法之前，我不能只检查是否存在类var $my_list = $('#my-list'); $my_list.sortable({ start: function() { if($('.unsaved', $my_list).length) { // DONOT ALLOW SORTING } else { // OK GO AHEAD AND SORT ALL YOU WANT } } }); $my_list.disableSelection();的元素，因为在任何给定时间都可以使用未保存的类将元素添加或删除到列表中。 / p>

实际上，当页面加载时，列表上永远不会有一个未保存类的元素。但是随着时间的推移，可以添加具有该类的元素，如果是这样，我不希望用户能够进行排序，一旦删除它，我想重新启用排序。

希望澄清我的问题。

Answer 1

您可以跟踪列表更新

代表：

// add new item to list, every time a new item added, refresh/remove the sortable
function add_item(item, $my_list){
  // add item stuff here
  if($my_list.find('.unsaved').length > 0){ 
     $my_list.sortable( "destroy" );
  } else {
     $my_list.sortable();
  }
}

function remove_item(item, $my_list){
  // remove item stuff here
  if($my_list.find('.unsaved').length > 0){ 
     $my_list.sortable( "destroy" );
  } else {
     $my_list.sortable();
  }
}

简单。因为它是ul标签。

$('body').on('my_list_ul_selector_here', 'change', function(){
  if($(this).find('.unsaved').length > 0){ 
     $(this).sortable( "destroy" );
  } else {
     $(this).sortable();
  }
});

Answer 2

您无法使用可排序窗口小部件的启动事件，因为到那时它取消它是为时已晚。使用列表中的mousedown事件，如下所示：

var $my_list = $('#my-list');
$my_list.sortable();
$my_list.disableSelection();

$('#my-list').on('mousedown', 'li', function () {
    if ($('.unsaved', $my_list).length) {
        $my_list.sortable('disable');
    } else {
        $my_list.sortable('enable');
    }
});

<强> jsFiddle example

Answer 3

您应该在 .sortable列表之前检查。

jQuery UI：如果此元素存在，则不允许排序

修改

3 个答案: