Question

修改

我发现在drop函数中，ui.draggable.index（）为我提供了删除幻灯片的新索引。有没有办法可以将这个索引传递给sortable？

ui.draggable.hide("slow",function() {
            $(this).appendTo(dropList).show("slow");
            console.log(ui.draggable.index())  //correct index
});

我有一个角度应用，我正在使用jQuery UI来拖放幻灯片。我正在使用Sortable和Droppable。

我正在尝试获取放置在droppable上的可拖动元素的索引。但是，我没有得到新删除元素的更新索引;我总是得到旧索引。

当我将它从一个可排序的拖放到另一个时，我得到了该元素的更新索引。

我可以在sortable中使用'receive'事件，但是当我将元素放在droppable上时不会触发。只有当我将一个元素从一个可排序的元素放到另一个可排序的元素（如预期的那样）时它才会触发。

请看看并帮助我，我一整天都在打扰它！

小提琴： http://jsfiddle.net/sriramr/UK5FP/4/

JS：

function SortableCTRL($scope) {
$scope.data = [{"title":"sub1","id":123},{"id":124,"title":"sub2"}];

$scope.sortableArray = [
    'One', 'Two', 'Three'
];
setTimeout(function() {
    $('.sortable').sortable({
        connectWith:'.sortable',
        stop:function(e,ui) {
             console.log(ui.item.index())   
        }
    });
    $(".cont").droppable({
    drop:function(event,ui) {
        var curr = $(this);
        var newId = "disp"+(curr.attr("id"))
        var newElem = $("#"+newId)
        var dropList = newElem.find(".sortable")
        ui.draggable.hide("slow",function() {
            $(this).appendTo(dropList).show("slow");
        });
    }
  });
});

}

Answer 1

我发现了问题。我正在使用.hide（）和.show（）动画与＆＃34;慢＆＃34;作为args。因此，对于新删除的列表中的最终更新，必须花费更多的微秒。以这种方式修改代码有效：

http://jsfiddle.net/sriramr/UK5FP/7/

ui.draggable.hide("fast",function() {
            $(this).appendTo(dropList).show("slow");
        });

并在可排序的停止fn中添加500毫秒的延迟：

stop:function(e,ui) {
            setTimeout(function() {
                console.log(ui.item.index())    
            },500)
        }

我不确定引入500毫秒延迟是否是一个好主意，但它目前是我唯一的解决方法。

jQuery可以使用droppable进行排序 - 索引未更新

1 个答案: