Question

我正在尝试创建现有图像的副本，每当我点击新的（克隆的）图像它应该消失，但没有什么对我有用，我做错了什么？感谢。

$(document).ready(function () {
$('#steps img').click(function () {
    var image_clone = $(this).clone();
    $(this).after(image_clone).addClass('image_extended');
});
$('.image_extended').click(function () {
    $(this).remove();
});

}）;

Answer 1

在中插入.image_extended元素后，需要为.image_extended 添加点击处理程序。＃step; #steps＆＃39;。您在此处完成此操作的方式，您在页面上的元素存在之前添加.image_extended点击处理程序。您可以在“#steps img＆＃39;”的单击处理程序中添加.image_extended的单击处理程序，但是每次＆时都需要注意不要为.image_extended重新添加该单击处理程序。＃39; #steps img＆＃39;处理程序被调用。在添加处理程序时，不要选择所有.image_extended元素，只需将其直接应用于image_clone即可。这样，该元素只会获得一次处理程序。

Answer 2

首先，您必须在克隆的图像上添加image_extended类。你正在做的是在原始图像上添加类。

其次，您必须在克隆的图像上绑定click事件处理程序。在这种情况下，添加事件处理程序的方式不起作用。因为$(selector).click只添加一次处理程序而不关心执行该行后添加的元素。为此，您可以使用下面给出的.on选择器，也可以在添加克隆图像时使用.click。

$(document).ready(function () {
    $('#steps img').click(function () {
        var image_clone = $(this).clone();
        $(this).after(image_clone.addClass('image_extended'));
    });
    $(document).on('click','.image_extended', function () {
        $(this).remove();
    });
});

或

$(document).ready(function () {
    $('#steps img').click(function () {
        var image_clone = $(this).clone();
        $(this).after(image_clone
            .addClass('image_extended')
            .click(function () {
                $(this).remove();
            })
        );
    });
});

我没有检查过第二个，但它应该正常工作。

jQuery无法选择和删除克隆

2 个答案: