Question

我有这个HTML：

<div id="categories" class="">
    <div class="list-group">
        <a id="427" data-parent="{ParentId}" href="#" class="list-group-item"><i class="fa indent0 fa-caret-down"></i>Home</a>
        <a id="482" data-parent="427" href="#" class="list-group-item"><i class="fa indent1 fa-caret-right"></i>Images</a>
        <a id="486" data-parent="482" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent2"></i>Png</a>
        <a id="487" data-parent="482" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent2"></i>Jpg</a>
        <a id="488" data-parent="482" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent2"></i>Bmp</a>
        <a id="483" data-parent="427" href="#" class="list-group-item active"><i class="fa fa-caret-right indent1"></i>Documents</a>
        <a id="489" data-parent="483" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent2"></i>pdf</a>
        <a id="490" data-parent="483" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent2"></i>word</a>
        <a id="492" data-parent="490" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent3"></i>1997-2000</a>
        <a id="493" data-parent="490" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent3"></i>2010</a>
        <a id="491" data-parent="483" href="#" class="list-group-item" style="display: none;"><i class="fa fa-caret-right indent2"></i>excel</a>
        <a id="484" data-parent="427" href="#" class="list-group-item"><i class="fa fa-caret-right indent1"></i>Videos</a>
        <a id="485" data-parent="427" href="#" class="list-group-item"><i class="fa fa-caret-right indent1"></i>Audio</a>
    </div>
</div>

我想要做的是将文档和子项移到图像之前。我创建了这个函数：

function getChildren($element) {  
    var id = parseInt($element.attr("id"));
    var $items = [];

    $items.push($element);

    $.each($categories.find("[data-parent=" + id + "]"), function (i, item) {
        var $this = $(this);
        var parentId = parseInt($this.data("parent"));

        if (id === parentId) {
            $.each(getChildren($this), function () {
                $items.push($(this));
            });
        }
    });

    return $items;
}

正确获取子元素和目标元素。在我的移动功能中，我有一些代码：

$actionBar.on("click", ".btn-moveup", function (e) {
    e.preventDefault();

    var $element = $categories.find(".active");

    if ($element.length === 1) {
        var parentId = parseInt($element.data("parent"));
        var currentId = parseInt($element.attr("id"));
        var index = 0;
        var $items = $("[data-parent=" + parentId + "]");

        $.each($items, function (i, item) {
            var id = parseInt($(this).attr("id"));
            if (currentId === id) {
                index = i;
            }
        });

        $children = getChildren($element);
        $children.insertBefore($items.get(index - 1));
    }
});

但是当我到 insertBefore 时出现错误对象[对象数组]没有方法＆＃39; insertBefore＆＃39; 。我理解错误，但我不知道如何解决它。有没有人对此有任何经验并知道如何解决它？

干杯，

/ r3plica

Answer 1

没关系，我是这样做的：

$actionBar.on("click", ".btn-moveup", function (e) {
    e.preventDefault();

    var $element = $categories.find(".active");

    if ($element.length === 1) {
        var parentId = parseInt($element.data("parent"));
        var currentId = parseInt($element.attr("id"));
        var index = 0;
        var $items = $("[data-parent=" + parentId + "]");
        var $children = getChildren($element);

        $.each($items, function (i, item) {
            var id = parseInt($(this).attr("id"));

            if (currentId === id) {
                index = i;
            }
        });

        $.each($children, function () {
            $(this).insertBefore($items.get(index - 1));
        });
    }
});

jquery insertBefore有多个元素

1 个答案: