与功能

Question

伊夫JQUERY交换机X格得到了与类排序X DIV（和排序（）; behavor）

<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> 

我想的onclick开关上的按钮

防爆自己的立场获得：

<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)")); 

但我想建立一个fonction，以与X元素这项工作中，功能拍摄数组作为参数那样：

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

任何想法？

Answer 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和新位置并定位每个元素。

更新

我添加了$.each()循环，检查地看到，插入该元素的位置是它目前拥有相同的位置，如果你尝试使用insertAfter()后自身插入元素，这里面的if声明，该元素将刚刚从DOM中删除。

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