Question

我有显示为ul li的手机列表。当用户点击“购买”按钮时，它会在另一个div“ordersDiv”中创建新的li，用户可以通过单击“删除”从购物车中删除他的购买。这必须删除具有匹配ID的li。创建购买的代码：

 $("#list").delegate("button",'click',function(){
        var  purchase = {id: null,name: null,price: null };
    var purchases = [];
    for(var i = 0; i < phones.length; i++){
        if(this.id === phones[i].id){
          purchase.id =  phones[i].id;
            purchase.name = phones[i].name;
            purchase.price = phones[i].price;
            //break;
             purchases.push(purchase);
            console.log(purchases);
            $.each( purchases, function(i, purchase){
                purchases.push("<li id='"+ purchase.id +"'>" + purchase.id +
                "<br>" + purchase.name + "<br>" + "Price:" +purchase.price + "<br><button id='"+purchase.id+"' type='button' class='btn-default'>remove</button>" +"</li>" );

            });
            $('#ordersUl').append(purchases);
        }
    }
});

应该删除li的代码：

 $("#ordersCartDiv #ordersUl").delegate("button","click", function() {
    var buttonId = $(this).attr('id');
    console.log(buttonId);
    //$("li[id=buttonId]").remove();
    $("#ordersUl").remove(buttonId);
    console.log("test");   // code indentation

});

问题是此代码不会删除任何内容。

Answer 1

你必须在remove函数中传递一个选择器，如下所示：

$("#ordersUl").remove('#'+buttonId);

Answer 2

在按钮ID上使用remove。

$("# " + buttonId).remove();

无需使用ordersUl，因为id是唯一的（？）。

如果您没有id唯一身份：

$("#ordersUl #" + buttonId).remove(); // Will remove button inside #ordersUl

从DOM中删除匹配元素集。

文档：http://api.jquery.com/remove/

Answer 3

$("#ordersUl").remove("#"+buttonId);

Answer 4

您应该在元素

上调用remove函数

$("li#"+buttonId).remove();

但ID应该是唯一的，所以以这种方式使用它是个坏主意。使用data-属性或类。

使用事件Javascript动态删除元素

4 个答案: