-1

我有 X div 类排序(和 sortable(); 行为)

<div class="sort" id="a"></div>
<div class="sort" id="b"></div>
<div class="sort" id="c"></div>
<div class="sort" id="d"></div>
<div class="sort" id="e"></div>

我想在按钮上切换他们的位置

前获得:

<div class="sort" id="b"></div>
<div class="sort" id="c"></div>
<div class="sort" id="e"></div>
<div class="sort" id="d"></div>
<div class="sort" id="a"></div>

我必须这样做:

$("#sort").sortable().disableSelection();
$("#sort li:eq(3)").insertAfter($("#sort li:eq(4)"));
$("#sort li:eq(0)").insertAfter($("#sort li:eq(4)"));

但是我想建立一个函数来使它与 X 元素一起工作,该函数将数组作为参数,如下所示:

{'a' : 4 , 'b' : 0, 'c' : 1, 'e' : 2, 'd' : 3}

任何想法?

4

1 回答 1

1
function sortElements(ELEMENTS) {
    $("#sort").sortable().disableSelection();
    $.each(ELEMENTS, function (eleID, elePOS) {
        if ($('#' + eleID).index() != elePOS) {
            $("#" + eleID).insertAfter("#sort li:eq(" + elePOS + ")");
        }
    });
    //I assume you need to re-initialize the `sortable` widget here
}

$('#my-button').on('click', function () {
    sortElements({'a' : 4 , 'b' : 0, 'c' : 1, 'e' : 2, 'd' : 3});
    return false;
});

这会传入您的元素 ID 对象和新位置以及每个元素的位置。

更新

if在循环中添加了语句$.each(),检查插入元素的位置是否与当前的位置相同,如果您尝试使用它insertAfter()在其自身之后插入元素,则该元素只会从 DOM 中删除。

这是一个演示:http: //jsfiddle.net/FMxZa/3/

于 2012-04-07T22:10:51.823 回答