2010-11-02 4 views
2

У меня есть список узлов, которые я могу перетащить.Нужна помощь в сортировке элементов

<ul id="container"> 
<li id="item_1">Item 1</li> 
<li id="item_2">Item 2</li> 
<li id="item_3">Item 3</li> 
<li id="item_4">Item 4</li> 
<li id="item_5">Item 5</li> 
<li id="item_6">Item 6</li> 
</ul> 

я могу нажать и перетащить # item_5 более на вершине # item_2 и на «падение», я могу вернуть источник (# item_5) и пункт получения упал на (# ст.2)

Как бы вставить выпавший элемент (# item_5) перед целью (# item_2), затем отрегулировать каждый узел после пункта 2 назад на одну позицию? Мне нужна помощь в методе для выполнения этой задачи

например.

function movebefore(a, b) {...} 

(Пожалуйста, предположим JavaScript рамки, как JQuery не могут быть использованы)

Фактический код: http://jsfiddle.net/danmasq/BkNAF/

ответ

1
function movebefore(a, b) { // If "a" is the node you're dragging and "b" is the node on top of which you dropped "a" 
    b.parentNode.insertBefore(a, b); // Or "b.nextSibling", depending on what you want to do 
} 

Это так просто! DOM позаботится о том, чтобы удалить элемент из предыдущего положения и отрегулировать другие элементы.

2

dropNode является целью снижения
dragNode является узлом тащат
вы что вы оба доступны.

var movebefore = function(dragNode , dropNode) { 

    dropNode.parentNode.insertBefore(dragNode , dropNode); 

} 
Смежные вопросы