Question

我有两个可排序的链表，称之为列表1和列表2.

列表1是用户可以选择的所有可能项目的列表，并将其拖入他的购物篮（列表2）。

我想要做的是在列表2（购物篮）中的每个项目旁边都有一个按钮（或链接），当点击该按钮时，将项目移回到列表1中，而用户实际上不必将其拖动到那里。

我知道我可以轻松实现这一点，只需使用remove（）从列表2中删除项目，然后使用append（）或after（）等将其添加回列表1但我希望动画可以动画

有没有办法可以实现这一点，以便自动“拖动”项目。从一个列表到另一个列表？如果是这样的话？

我已经好好看看但无济于事，但如果可以的话，网站会好得多。因此，非常感谢您提供的任何帮助。感谢。

Answer 1

好的，我想出了答案，所以我想问这个问题我应该把答案放在这里帮助其他需要知道的人。

我有点愚蠢地寻找通过jquery ui来实现它的方法，因为我的列表可以排序是无关紧要的，我只需要使用jquery来移动元素并为其设置动画。

以下功能非常有用：

function moveAnimate(element, newParent){
    var oldOffset = element.offset();
    element.appendTo(newParent);
    var newOffset = element.offset();

    var temp = element.clone().appendTo('body');
    temp    .css('position', 'absolute')
            .css('left', oldOffset.left)
            .css('top', oldOffset.top)
            .css('zIndex', 1000);
    element.hide();
    temp.animate( {'top': newOffset.top, 'left':newOffset.left}, 'slow', function(){
       element.show();
       temp.remove();
    });
}

这是由Davy8在这个帖子中提供的： JQuery - animate moving DOM element to new parent?

Jquery UI可排序，自动移动项目

1 个答案: