在 jQuery 中使用 remove(） 后添加相同的元素

Adding the same element after using remove() in jQuery

本文关键字：添加 元素 jQuery remove      更新时间：2023-09-26

我正在使用此代码在一个潜水区域添加点。现在我想删除旧的点击点来更新它，我正在使用jQuery remove()函数。它工作正常，但在那之后它不会向我显示该div 的下一个点击点。

jQuery(document).ready(function () {
    $("#test").click(function (e) {
        $(".myimg").first().clone().offset({
            left: e.pageX,
            top: e.pageY
        }).appendTo('body');
    });
    $('.remove').click(function(){
        $('.myimg').remove();
    });
})

http://jsfiddle.net/szCAL/9/

您正在使用类 .myimg 删除主克隆元素，您需要将其保存为备份，因为当您单击该div 时，您需要使用该 img 进行克隆，

这是代码

我向该克隆元素添加了另一个类名，并删除了具有该类名的点。

您可以只删除克隆，如下所示：

jQuery(document).ready(function () {
    var el = $('.myimg').first();
    $("#test").click(function (e) {
        el.clone().offset({
            left: e.pageX,
            top: e.pageY
        }).appendTo('body').addClass("clone");
    });
    $('.remove').click(function(){
        $('.clone').remove();
    });
})

http://jsfiddle.net/szCAL/13/

如果你创建一个新元素而不是克隆，这个问题会自己解决，你可以摆脱第一个烦人的元素：

jQuery(document).ready(function () {
    $("#test").click(function (e) {
        $('<img />', {
            style   : 'left: '+e.pageX+'px;top:'+ e.pageY + 'px;height: 10px;width:10px',
            src     : 'http://www.nystce.nesinc.com/images/tests_circle.gif',
            'class' : 'myimg'
        }).appendTo('body');
    });
    $('.remove').click(function(){
        $('.myimg').remove();
    });
});

小提琴

您需要

再次添加元素才能开始显示位置

$('.remove').click(function(){
        $('.myimg').remove();
        $('#test').append("<img class='myimg' width='10' src='http://www.nystce.nesinc.com/images/tests_circle.gif' height='10' />");
    });

结帐小提琴

相关文章：