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

Question

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

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

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

my jsFiddle

Answer 1

要附加直接拖动项。你只需要用新的东西来替换旧的东西。

因此改变你的功能，这一点 - 的

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

    }); 
    self.html(listItem); 

Demo here

Answer 2

使用.html()代替.appendTo()

Working Fiddle

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

})); 

Answer 3

您已经从列表中日删除所有项目在有一类placeholder所以只设置你的新项目有类placeholder

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

现在，您的代码将找到的项目，并正确地将其删除。

Example JSFiddle