可能不允许在同一列表中使用jQuery可排序移动项,但是可以使用其他列表吗？

Question

我有两个连接的可排序列表:list_b和list_a.我想要实现的是仅允许可见的占位符list_b.list_a只是用来拉取所以我不想在拖动时占位符list_a(至少是可见空间),但我想list_b在拖动时显示占位符list_a.

基本上:

• list_aitem to list_b=显示占位符list_b
  
• list_bitem to list_b=显示占位符list_b
  
• list_aitem to list_a=不显示占位符,或使用样式为display的占位符:none; 在list_a
  
• list_bitem to list_a=不显示占位符,或使用样式为display的占位符:none; 在list_a
  

jQuery的:

$( "#list_a, #list_b" ).sortable({
connectWith: ".connected_sortable",
start: function (e, ui) {
  //Closest I can get but now both lists don't show placeholders.
  if(ui.item.context.parentNode.id != 'destination_list')
    ui.placeholder.hide();
},
}).disableSelection();

HTML:

<ul id="list_a" class="connected_sortable">
  <li value="0">test text</li>
  <li value="1">test text</li>
</ul>

<ul id="list_b" class="connected_sortable">
  <li value="2">test text</li>
</ul>

除了将jQuery draggable插件与可排序插件结合使用之外,有没有办法做到这一点？我不想去那条路,因为我在使用两个插件时遇到了一些jQuery错误.

Answer 1

js小提琴示例,我的回答

您可以将list_a连接到list_b但不将list_b连接到list_a.这样将list_b项拖到list_a是不可能的.例:

$( "#list_a" ).sortable({
    connectWith: "#list_b"
});
$( "#list_b" ).sortable({
    placeholder: "placeholder"
});

$( "#list_a, #list_b" ).disableSelection();

但是,如果你只想隐藏占位符,那么你可以用css做到这一点:

#list_a .placeholder {display:none}