Question

我有两个通过jQuery可连接的列表连接。这些列表彼此相邻。右侧列表中的列表项可以拖到左侧列表中，左侧列表中的列表项不可拖动。

当我将列表项从右侧列表拖到左侧列表时，我有一个检查位置，检查是否有任何新的连接列表项最初是否来自正确的列表，如果是这种情况，那么列表项通过jQuery删除函数删除。

stop: function (event, ui) {
    var nextItemclass = ui.item.next().attr("class");
    var prevItemClass = ui.item.prev().attr("class");
    if ((nextItemclass == "sortableRow") && (ui.item.parent().hasClass('static'))) {
        ui.item.next().remove(); //in stead of Remove I want this item to reset to it's original UI
    }
    if ((prevItemClass == "sortableRow") && (ui.item.parent().hasClass('static'))) {
        ui.item.prev().remove(); //in stead of Remove I want this item to reset to it's original UI
    }
}

现在我不想完全删除列表项，而是将其返回到原始列表，即右侧列表。

所以我希望将代码ui.item.prev().remove();更改为将列表项重置为其原始列表的代码。我也在原始代码中对此进行了评论。

这是我完整代码的小提琴：

http://jsfiddle.net/Y2RJj/30/

您会注意到，如果您将两个不同的可排序项目拖到不可排序的项目下方，那么首先存在的项目将被完全删除。我希望以这样的方式更改代码：首先将列表项重置为原始列表，而不是完全删除。

Answer 1

你可以试试这个

 $(".right").append(ui.item.prev())

FIDDLE

Answer 2

你需要追加必须转移到右边的当前元素

以下是工作示例。 http://jsfiddle.net/mailtoshebin/BuT7p/

 $(function() {
            $( ".sortable" ).sortable({
                connectWith: ".connected-sortable",
                cancel: ".not-sortable",
                activate: function ( event, ui ){
                    ui.item.prev().removeClass("highlight");
                },
                stop: function( event, ui ) {                   
                    var nextItemclass = ui.item.next().attr("class");
                    var prevItemClass = ui.item.prev().attr("class");
                    if ((nextItemclass == "sortableRow")&&(ui.item.parent().hasClass('static'))){

                       $('right').append(ui.item.next())
                         //   ui.item.next().remove();//in stead of Remove I want this item to reset to it's original UI
                        }
                    if ((prevItemClass == "sortableRow")&&(ui.item.parent().hasClass('static'))){
                            $('#right').append( ui.item.prev())
                         //   ui.item.prev().remove();//in stead of Remove I want this item to reset to it's original UI
                        }
                        if(prevItemClass == "not-sortable"){
                        ui.item.prev().addClass("highlight");
                    }
                },
                placeholder: "sortable-placeholder"

            });
        });

如何重置可排序的jquery列表中的列表项而不是完全删除它？

2 个答案: