如何在购物车中拖动新数据后从购物车中删除旧数据

how to remove old data from shoppingcart after drag new one data in shoppingcart

本文关键字:数据 购物车 删除 拖动 新数据      更新时间:2023-09-26

我想编写一些jQuery代码,当我们拖入它时,它一次只显示一个值。例如,如果我拖动Bank那么它应该只显示Bank之后。如果我拖动Rent它应该只显示Rent,反之亦然。

在我的jsFiddle中有一些代码错误,请帮助我解决它们。

$("#shoppingCart1 ol").droppable({
    // ....
})

我的小提琴

您直接追加拖动的项目。您只需要用新项目替换旧项目即可。

所以把你的函数改成这个——

   var listItem =  $("<li></li>", {
       "text": ui.draggable.text(),
       "data-id": productid
    });
   self.html(listItem);

在这里演示

使用 .html() 而不是 .appendTo()

工作小提琴

$(this).html($("<li></li>", {
    "text": ui.draggable.text(),
        "data-id": productid
}));

您已经从列表中删除了具有类placeholder的每个项目,因此只需将新项目设置为具有类placeholder

        $("<li></li>", {
           "text": ui.draggable.text(),
           "data-id": productid,
           "class": "placeholder"               
        }).appendTo(this);

现在,您的代码将找到该项并将其正确删除。

示例 JSFiddle