Question

我正在使用CKEditor创建富文本，并将生成的html嵌入到li中包含在无序列表（ul）中的div中。我使用jQuery和各种比较对li进行排序。当富文本本身包含ul或ol，CKEditor将允许时，排序失败并显示FF Firebug中的消息：

“HierarchyRequestError：节点无法插入层次结构中指定的点”

并从jQuery引用此代码：

append: function() {
    return this.domManip(arguments, true, function( elem ) {
        if ( this.nodeType === 1 || this.nodeType === 11 ) {
            this.appendChild( elem );
        }
    });
},

当html不包含任何ul或ol时，排序正常。

以下是HTML上下文：

一个无序列表，其中每个li被归类为“RetailerSearchSectionLine”并包含包含富文本作为html的div。

以下是失败的jQuery排序函数之一：

var TransferArray = $(".RetailerSearchSectionLine").toArray().sort(function(a, b)
{
    var distance1 = $(a).data("DistanceFromReferenceLocation");
    var distance2 = $(b).data("DistanceFromReferenceLocation");
    return (distance1 - distance2);
});
$("#RetailerSearchSectionBody ul").append(TransferArray);

有什么建议吗？我正在考虑对数组进行排序，然后根据排序结果重新排列ul。但是，如果存在一些基本问题，那么实际上可能无法正常工作，我没有看到列表中的列表。

Answer 1

该行

$("#RetailerSearchSectionBody ul").append(TransferArray);

看起来不对，因为$("#RetailerSearchSectionBody ul")可能会选择一个集合（包括子UL）而不是一个唯一元素。

以下内容应安全地选择一个独特元素：

$("#RetailerSearchSectionBody").children("ul").eq(0).append(TransferArray);

如果这不起作用，那么在原始的jQuery包装元素上执行排序而不是分解成真正的数组可能更为正常，如下所示：

Array.prototype.sort.call($(".RetailerSearchSectionLine"), function(a, b) {
    var distance1 = $(a).data("DistanceFromReferenceLocation");
    var distance2 = $(b).data("DistanceFromReferenceLocation");
    return (distance1 - distance2);
}).each(function(i, item) {
    $("#RetailerSearchSectionBody").children("ul").eq(0).append(item);
});

你采用哪种方法可能是学术上的，因为排序本身似乎不是问题。无论如何，这是你可以尝试的其他东西。

包含ol或ul的li的排序因HierarchyRequestError而失败：无法在层次结构中的指定点插入节点

1 个答案: