jQuery UI 多 DnD 重复问题

Question

我一直在研究一个拖放解决方案，其中用户可以从左侧的元素列表中选择多个项目，然后将它们同时拖动到右侧的 .sortable() 区域this 示例。

问题是用户选择并拖动多个项目后，然后仅拖动一个项目，单个项目将被复制。

这是一个细分：

• 用户单击多个项目，切换“选定”类
• 用户拖动选定的项目之一，所有其他选定的项目紧随其后 - 用户将它们放入容器中。
• 然后，用户将单个项目（无需切换“已选择”）拖动到右侧的容器中，拖放后，该项目将被复制。

我想过改变逻辑：

var selected = $('#ul-left .selected');
  if (selected.length === 0) {
    selected = $(this);
  }
var container = $('<div></div>').attr('id', 'draggingContainer');
container.append(selected.clone());
return container;

要说类似（伪代码）：

if( selected >= 1){
  proceed as written above
} else {
  set the helper property to clone ( as if I would've done helper: 'clone',)
}

我不确定是否有办法手动执行此操作，此外，我什至不确定我是否正在寻找正确的方向 - 所以我去 :)

这是我的fiddle，

谢谢大家看这个。 肯

Answer 1

如果您更改停靠点以添加刷新，它应该可以解决此问题：

 stop:function (e, ui) {
          $('#wrapper ul li').removeClass('selected').css({'background-color':'#FFD'});
          $('#ul-right').append(ui.helper.children());
          $('#ul-right').sortable('refresh');// add this line
        }