jQuery可排序的占位符位置(索引)

时间:2012-08-03 11:30:40

标签: jquery jquery-ui jquery-ui-sortable

我想在可排序的占位符中显示可排序的元素位置(或索引)。它在拖动第一个元素时起作用,而不是与其他元素拖动(位置0而不是1)。

请检查:http://jsfiddle.net/upsidown/Hw2rJ/

我做错了什么?

3 个答案:

答案 0 :(得分:5)

我一直在寻找类似挑战的解决方案,并找到了这个http://forum.jquery.com/topic/sortable-show-placeholders-position-and-give-it-a-number并进行了一些调整(并进行了修正)让它发挥作用

$('.elements-sortable').sortable({
    placeholder: 'sortable-placeholder',
    opacity: 0.6,
    helper: 'clone',
    sort: function(event,ui){
        $(ui.placeholder).html(Number($('.elements-sortable > div:visible').index(ui.placeholder)+1));
    }
});

答案 1 :(得分:1)

可能因为它在你拖延的元素之前附加了新元素

所以让我们试试这段代码

var position;
$(".elements-sortable").sortable({

placeholder: "sortable-placeholder",
opacity: "0.6",

start: function(event, ui) {

    position = position = Number($(".elements-sortable > div:not(.ui-sortable-helper)").index(ui.placeholder)+1);
    $(".sortable-placeholder").html('Drop me at position ' + position);

},

change: function(event, ui) {
    position = position = Number($(".elements-sortable > div:not(.ui-sortable-helper)").index(ui.placeholder)+1);
    $(".sortable-placeholder").html('Drop me at position ' + position);
}
});

我在jsFiddle

上测试了它

答案 2 :(得分:-2)

jsFiddle

上试试
$(".connectedSortable").sortable({
    connectWith: ".connectedSortable",
    stop: function (e,ui ) {
        $("body").append("<p> current position : " + $(ui.item).prevAll().length + "</p>");
    }
});