这个问题是关于如何在“sortable”元素上禁用排序,但仍然能够与“connectWith”一起正常工作。
如果在列表2中没有拖放(我称其为自我放置),则此操作将返回列表1中的元素到其原始位置。
$("#list1").sortable({
connectWith: ".connected-fields",
beforeStop: function(event, ui) {
// Don't allow resorting in list1... would call cancel here, but there is a jquery 1.7 bug so we
// need to do the check here but do the cancel in "stop" below. @see http://bugs.jqueryui.com/ticket/6054
$(this).sortable("option", "selfDrop", $(ui.placeholder).parent()[0] == this);
},
stop: function(event, ui) {
var $sortable = $(this);
if ($sortable.sortable("option", "selfDrop")) {
$sortable.sortable('cancel');
return;
}
}
});
$("#list2").sortable({
connectWith: ".connected-fields"
});
然后我会删除原始的可排序逻辑,并应用附加到单个可排序的类。例如,您有三个函数用于排序的两个列表。如果其中一个是sort=disabled,则删除具有选项conenctWith的可排序类,并将单个排序类应用于您连接的列表。如果要停止该列表,则对另一个列表执行相同操作。
例子:
$('sortBoth').sortable({connectWith: $('.sortListToConnect)});
$('.sortList2').sortable();
$('.sortList3').sortable();
根据您需要的功能,相应地从每个列表中删除或添加类。这是一种简单处理它的方法。希望我已经清楚地陈述了它,让我们快乐地编码吧 :)
您可以取消左列中的项目进行自我排序,但仍然可以将它们用于 connectWith。