具有多个元素的jQuery UI Sortable抛出“ TypeError：无法读取null的属性'insertBefore'”

Question

我正在尝试根据此答案中的示例使用多个元素实现拖放：http : //jsfiddle.net/hQnWG/614/

该示例可与jQuery 1.9.1和jQuery UI 1.9.2（最高1.10.1）配合使用，但是当我使用较新的版本（例如jQuery 1.11.3和jQuery UI 1.10.2或更高版本）时，我得到以下信息问题。

当选择多个元素并开始将最底部的选定元素缓慢拖动到顶部时，恰好在将其捕捉到下一个位置之前，会抛出以下JS错误：

Uncaught TypeError: Cannot read property 'insertBefore' of null
   at t.(/hQnWG/614/anonymous function).(anonymous function)._rearrange (https://code.jquery.com/ui/1.10.2/jquery-ui.min.js:7:15171)
   at t.(/hQnWG/614/anonymous function).(anonymous function)._rearrange (https://code.jquery.com/ui/1.10.2/jquery-ui.min.js:5:5028)
   at t.(/hQnWG/614/anonymous function).(anonymous function)._mouseDrag (https://code.jquery.com/ui/1.10.2/jquery-ui.min.js:7:6)
   at t.(/hQnWG/614/anonymous function).(anonymous function)._mouseDrag (https://code.jquery.com/ui/1.10.2/jquery-ui.min.js:5:5028)
   at t.(/hQnWG/614/anonymous function).(anonymous function)._mouseMove (https://code.jquery.com/ui/1.10.2/jquery-ui.min.js:5:12328)
   at t.(/hQnWG/614/anonymous function).(anonymous function)._mouseMove (https://code.jquery.com/ui/1.10.2/jquery-ui.min.js:5:5028)
   at HTMLDocument.o._mouseCapture._mouseDistanceMet._mouseDelayMet._mouseMoveDelegate (VM687 jquery-ui.min.js:5)
   at HTMLDocument.dispatch (VM251 jquery-1.11.3.min.js:4)
   at HTMLDocument.r.handle (VM251 jquery-1.11.3.min.js:4)

这是带有升级的jQuery版本的示例jsfiddle的分支：http : //jsfiddle.net/v3p6wsk2/6/

我尝试对其进行调试，但是找不到任何解释说明所拖动项目的parentNode如何为null。

我什至在jQuery UI 1.10.2中都找不到任何提示。更改日志，记录可能会破坏该脚本的更改。

不幸的是，我无法在我正在处理的项目中更改版本。是否有可能使它与上述版本一起使用？

Answer 1

据我所知，问题在于parentNode.insertBefore调用的元素是被拖动的元素之一（已从原始表中删除），因此实际上不再有父级。

真正让我感到困惑的是，我认为问题不在于helperor stop函数内，而是介于两者之间，因为错误是在sort-event 之后立即触发的。

我不知道这个问题的根源是因为它在较旧版本中起作用，但是通过反复试验，我可能找到了解决您问题的方法。

除了删除帮助器中的元素，您还可以隐藏它们，然后在将拖放的元素插入列表后删除隐藏的元素。

看到我刚刚更新的曲折小提琴。

尽管这不能解决（甚至无法找到）此问题的原因，但这可能会解决您的问题。