Question

我正在尝试实施横幅广告管理系统，并计划使用jquery Photo Manager。我目前面临的问题是我似乎无法在主容器上克隆父映像。

以下是codes小提琴的链接（它与jQuery UI网站基本相同）

我打算创建的是允许用户从左向右拖动或添加图像，用户可以多次添加相同的图像，但是一旦图像添加到右侧，它就会从左侧消失。

我正在查看这段代码以获得解决方案但是没有看到任何特定于项目移动的DOM元素的删除。只有从DOM中删除的项目才是图标。

function deleteImage($item) {
    $item.fadeOut(function () {
        var $list = $("ul", $trash).length ? $("ul", $trash) : $("<ul class='gallery ui-helper-reset'/>").appendTo($trash);
        $item.find("a.ui-icon-trash").remove();
        $item.append(recycle_icon).appendTo($list).fadeIn(function () {
            $item.animate({
                width: "48px"
            })
                .find("img")
                .animate({
                height: "36px"
            });
        });
    });
}

有人可以帮我解释一下。

提前致谢。

Answer 1

实际上使用jquery .clone()函数就可以了。我所要做的就是不是传递元素的对象，而是通过事件传递他们的克隆。

$trash.droppable({ accept: "#gallery > li", activeClass: "ui-state-highlight", drop: function (event, ui) { deleteImage(ui.draggable.clone(true)); } });

将克隆的参数设置为true，制作包含所有事件的元素的深层副本。

$("ul.gallery > li").click(function (event) { var $item = $(this), $target = $(event.target); if ($target.is("a.ui-icon-trash")) { deleteImage($item.clone(true)); } else if ($target.is("a.ui-icon-zoomin")) { viewLargerImage($target); } else if ($target.is("a.ui-icon-refresh")) { $item.remove(); } return false; });

以下是工作小提琴的链接供参考。 Link

Jquery拖放照片编辑器与父容器上的克隆

1 个答案: