jQuery 可拖动 +可排序 - 如何更改可排序项目？

Question

我有一个使用以下选项初始化的可排序视频列表：

items: '.videoBox:not(.isFirst, .isLast)',

第一个和最后一个视频不可排序，也不能以任何方式拖动 - 这太棒了！

使用 connectToSortable 选项将其连接到另一个可拖动的视频列表。我希望能够将一些视频拖到 isLast 和 isFirst 视频（其中有很多）之间，因此对于那些我需要再次对这些项目进行排序的视频，所以我使用：

start: function(event, ui) {
  if (// my test //)
  {
      $('#timeline').sortable('option', 'items', '.videoBox');
  }
},

这允许我在以前不可排序的项目之间拖放 - 太棒了！

现在，我想在拖动完成后将可排序恢复到初始设置，因此我将其放入可拖动初始化中：

stop: function() {
  if (// my test //)
  {
    $('#timeline').sortable('option', 'items', '.videoBox:not(.isFirst, .isLast)');
    $('#timeline').sortable('refresh');
    $('#timeline .videoBox.isLast, #timeline .videoBox.isFirst').draggable('destroy');
  }
},

如果可拖动未放入#timeline，则效果很好。但是，如果将其放入 #timeline 中，则似乎不会调用此回调（？）。我已将完全相同的代码添加到可排序事件中：stop、update 和 deactivate，虽然我可以看到这些回调正在被触发，isFirst 和 isLast 视频仍然可以拖动。

然而它们不可排序 - 所以我认为问题在于 .draggable('destroy') 位...有什么想法/建议吗？

干杯， 汤姆

Answer 1

我无法修复甚至无法确定上述问题的原因。然而，我找到了一个看起来相当稳健的解决方法。

在 sortable init 的 stop 回调中：

stop: function() {
    $('#timeline').sortable('option', 'items', '.videoBox:not(.isFirst, .isLast)');
    opts = $('#timeline').sortable('option');
    $('#timeline').sortable('destroy');
    $('#timeline').sortable(opts);
}

第一行设置 items 选项，就像我之前所做的那样。然后，我将可排序初始化选项保存到变量中，销毁可排序行为并使用正确的选项重新初始化它。这就是我现在想要的 - 我销毁了 isFirst 和 isLast 项上的可拖动项）。我已将 stop 回调与上面的 draggable 回调完全相同，这是当拖动未结束于可排序时的情况所必需的。

看起来有点像大锤方法，但正在努力寻找更好的方法。有兴趣知道是否有人有任何其他建议。

汤姆