Question

我要求与 this Jquery demo非常匹配，这是一个简单的购物车演示。基本上我需要对这个演示进行两次增强。

我需要一个文本输入以及可用的“产品”。因此，当我拖放其中一个产品时，应该拖动文本字段，用户将在“购物车”字段中填写该文本字段。
我需要在购物车中的每件商品前面加上“十字架”，可以用来删除某件商品。 Jquery的“破坏”功能似乎并没有这样做。那么如何从购物车中删除商品呢？

感谢您的帮助。

Answer 1

您可以在可拖动定义上指定自己的“帮助器”。无论你指定什么html作为助手，都会在拖动动画期间显示。在您的可排序（演示中的放置区域）中，您可以覆盖beforeStop函数。在那里，您可以将项目替换为您想要实际放入购物车的任何内容。在那里，您可以使用javascript或其他东西添加X按钮来删除项目

我最近实现了这个从数据表拖动到列表，所以不得不将tr转换为li。它适用于jQuery 1.4但是当我在1.5中拖出顶部时，我得到了奇怪的结果，我还没有解决。这是我的助手定义

helper: function() {
        var text = this.children[0].innerText;
        var result = "<li id='"+this.id+"'>"+text+"</li>";
        return result;
    },

这是我的beforeStop函数

beforeStop: function( event, ui ) {
        var id = ui.helper.attr( "id" );
        var text = ui.helper.text();
        var li = "<li id='"+id+"'>"+text+"</li>";
        $(ui.item).replaceWith( li );
    }

增强Jquery拖放演示

1 个答案: