选择并拖动多个列表项（jQuery ui可排序）

我已经找到了很好的解决方案最后一个答案：

HTML:

带有jQuery和jQuery UI的JavaScript：

它工作得很好，但当我在Google Chrome中拖动两个或多个元素时，JS控制台会显示以下错误：

未捕获的TypeError:无法调用null的方法“insertBefore”

---

我该如何修复它？

我认为这是jquery UI中的一个错误\u重新排列函数。。。 所以我做了一个破解，覆盖了这个方法。。。 在dom就绪后插入以下代码…这将解决此问题

$.ui.sortable.prototype._rearrange = function (event, i, a, hardRefresh) {

                a ? a[0].appendChild(this.placeholder[0]) : (i.item[0].parentNode) ? i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction === "down" ? i.item[0] : i.item[0].nextSibling)) : i.item[0];
                this.counter = this.counter ? ++this.counter : 1;
                var counter = this.counter;

                this._delay(function () {
                    if (counter === this.counter) {
                        this.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove
                    }
                });

            }

这是小提琴

---

Safari 6.0.3和OS X 10.8.3上没有错误。我以前在你的代码中没有看到insertBefore？问题是jQuery选择器可能没有通过var test=$'myNoneExcestingElement'；和console.logtest；将打印空或未定义。25.0中没有错误chrome@DavidChase因为示例中没有.insertBefore方法；或者它被用作另一种方法的替代品，但不能肯定。@Allendar我看到了，我只是想分享我的测试：错误仍然会出现。只需从第一个列表1和列表2中选择两个元素，并将它们仅拖动到此列表中。在2或3次操作后，您将得到错误。我在几秒钟内数了10多个错误。

$("ul").on('click', 'li', function (e) {
    if (e.ctrlKey || e.metaKey) {
        $(this).toggleClass("selected");
    } else {
        $(this).addClass("selected").siblings().removeClass('selected');
    }
}).sortable({
    connectWith: "ul",
    delay: 150, //Needed to prevent accidental drag when trying to select
    revert: 0,
    helper: function (e, item) {
        var helper = $('<li/>');
        if (!item.hasClass('selected')) {
            item.addClass('selected').siblings().removeClass('selected');
        }
        var elements = item.parent().children('.selected').clone();
        item.data('multidrag', elements).siblings('.selected').remove();
        return helper.append(elements);
    },
    stop: function (e, info) {
        info.item.after(info.item.data('multidrag')).remove();
    }

});

$.ui.sortable.prototype._rearrange = function (event, i, a, hardRefresh) {

                a ? a[0].appendChild(this.placeholder[0]) : (i.item[0].parentNode) ? i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction === "down" ? i.item[0] : i.item[0].nextSibling)) : i.item[0];
                this.counter = this.counter ? ++this.counter : 1;
                var counter = this.counter;

                this._delay(function () {
                    if (counter === this.counter) {
                        this.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove
                    }
                });

            }