,可以通过以下方法实现:
cancel
选项:在初始化可排序列表时,可以通过设置cancel
选项来指定不允许拖动的元素或选择器。例如,如果父列表的类名为.parent-list
,子列表的类名为.child-list
,可以使用以下代码来阻止拖动到父或子列表中:$(".sortable").sortable({
cancel: ".parent-list, .child-list"
});
connectWith
选项:connectWith
选项用于指定可排序列表之间的连接。通过设置不同的connectWith
值,可以限制拖动的范围。例如,如果父列表的类名为.parent-list
,子列表的类名为.child-list
,可以使用以下代码来限制拖动到父或子列表中:$(".sortable").sortable({
connectWith: ".sortable:not(.parent-list, .child-list)"
});
beforeStop
事件:beforeStop
事件在拖动停止之前触发,可以在事件处理程序中检查拖动的目标位置是否是父或子列表,并取消拖动操作。例如,可以使用以下代码来阻止拖动到父或子列表中:$(".sortable").sortable({
beforeStop: function(event, ui) {
var parentList = $(ui.item).closest(".parent-list");
var childList = $(ui.item).closest(".child-list");
if (parentList.length > 0 || childList.length > 0) {
return false; // 取消拖动操作
}
}
});
以上是防止Jquery可排序项移动到父或子嵌套可排序列表的方法。对于更详细的Jquery可排序列表的使用和相关概念,可以参考腾讯云的相关产品:Jquery Sortable。
领取专属 10元无门槛券
手把手带您无忧上云