改变开关位置行为

如何在可排序中更改开关行为？ 我的意思是默认情况下1 - 2 - 3 - 4 http://jsfiddle.net/keGuN/当我切换4和1位置时 – 它们变换为4 - 1 - 2 - 3 。 我只想要4和1 （ 4 - 2 - 3 - 1 ）的开关位置。 怎么做？

Answer 1

我想我明白你要做什么。 jQuery的Sortable实际上并不是为了满足您的要求而设计的。 但是，使用Sortable公开的事件，您可以将拖动项目（A）的位置与先前位于放置A的点（B）中的项目进行交换。 我认为这可以达到你想要的效果：

jsFiddle演示

jQuery的：

 $(function() { var oldIndex; $("#sortable").sortable({ start: function(event, ui) { oldIndex = ui.item.index(); }, stop: function(event, ui) { var newIndex = ui.item.index(); var movingForward = newIndex > oldIndex; var nextIndex = newIndex + (movingForward ? -1 : 1); var items = $('#sortable > div'); // Find the element to move var itemToMove = items.get(nextIndex); if (itemToMove) { // Find the element at the index where we want to move the itemToMove var newLocation = $(items.get(oldIndex)); // Decide if it goes before or after if (movingForward) { $(itemToMove).insertBefore(newLocation); } else { $(itemToMove).insertAfter(newLocation); } } } }); $("#sortable").disableSelection(); }); 

唯一值得注意的问题是位置不是在拖动时更新，而是仅在项目在新位置被删除之后。

Answer 2

您可以使用draggable / droppable实现交换

 $(function() { $(".swapable"). draggable({ revert: true }). droppable({ drop:function(event,ui){ swapNodes($(this).get(0),$(ui.draggable).get(0)); }}); }); 

https://stackoverflow.com/a/698440/2033671

 function swapNodes(a, b) { var aparent= a.parentNode; var asibling= a.nextSibling===b? a : a.nextSibling; b.parentNode.insertBefore(a, b); aparent.insertBefore(b, asibling); } 

http://jsfiddle.net/keGuN/1/