Javascript 我的JS工作在第二次点击

这是我的JS。我不知道为什么附加到最后一个子项创建的“X”在第一次单击时不起作用，但在第二次单击时起作用。“x”url位于克隆的分区中。这是导致问题的原因吗？或者HTML中有什么错误

$（文档）.ready（函数（）{
$（“.add”）。单击（函数（）{
var aaa=$（this.parent（“div”）.attr（'id'））
$（this）.parent（）.children（“.add”）.siplines（“.name、.detail、.price”）.clone（）.appendTo（“.CART”）.wrapAll（“”）
$（此）.removeClass（“添加”）.addClass（“添加”）；
$（“.dump:last child”）.append（“”）；
$（“.dump”）.removeClass（“dump”）
});
})
////////////////
函数delC（）{
$（文档）.on（'单击'，'.delC'，函数（）{
var xx=$（this.parent（“div”）.attr（'class'））
$（“+xx+”）。删除（）
})
}

通用串口总线
USB类型1
1500
20克
添加
内存
RAM类型1
2000
50克
添加

问题在于您正在绑定

delC

函数中的click事件。因此，第一次单击时，只需绑定事件（然后绑定越来越多的事件处理程序）

取而代之的是删除

delC

函数，只需首先委托删除事件：

$（文档）.ready（函数（）{
$（“.add”）。单击（函数（）{
var aaa=$（this.parent（“div”）.attr（'id'））
$（this）.parent（）.children（“.add”）.siplines（“.name、.detail、.price”）.clone（）.appendTo（“.CART”）.wrapAll（“”）
$（此）.removeClass（“添加”）.addClass（“添加”）；
$（“.dump:last child”）.append（“”）；
$（“.dump”）.removeClass（“dump”）；
});
})
$（文档）.on（'单击'，'.delC'，函数（）{
var xx=$（this.parent（“div”）.attr（'class'））
$（“+xx+”）。删除（）
});

通用串口总线
USB类型1
1500
20克加
内存
RAM类型1
2000
50克加
您不需要在href上调用单独的函数。您可以将其绑定到一个click函数

$(document).on('click', '.delC', function(e){
        e.preventDefault();
        var xx = $(this).parent("div").attr('class')
    $("."+xx+"").remove()
    })

使用JSFIDLE
这应该可以做到


$（函数（）{
$（“.add”）。单击（函数（）{
var aaa=$（this.parent（“div”）.attr（'id'））
$（this）.parent（）.children（“.add”）.siplines（“.name、.detail、.price”）.clone（）.appendTo（“.CART”）.wrapAll（“”）
$（此）.removeClass（“添加”）.addClass（“添加”）；
$（“.dump:last child”）.append（'x'）；
$（“.dump”）.removeClass（“dump”）
});
$（文档）.on（'click'，'.delC'，函数（e）{
e、 预防默认值（）；
var xx=$（this.parent（“div”）.attr（'class'））
$（“+xx+”）。删除（）
})
});

$(function () {
    $(".add").click(function () {
        var aaa = $(this).parent("div").attr('id')
        $(this).parent().children(".add").siblings(".name,.detail,.price").clone().appendTo(".CART").wrapAll('<div class="dump ' + aaa + '"></div>')
        $(this).removeClass("add").addClass("added");
        $(".dump:last-child").append('<a class="delC">x</a>');
        $(".dump").removeClass("dump")
    });

    $(document).on('click', '.delC', function (e) {
        e.preventDefault();
        var xx = $(this).parent("div").attr('class')
        $("." + xx + "").remove()
    })

});