jQuery UI可排序-仅在放置事件时排序 [英] Jquery UI sortable - sort only on drop event
本文介绍了jQuery UI可排序-仅在放置事件时排序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我要在拖动项目时禁用对项目的排序.只有在放置完毕后,才可以对项目进行相应的排序.
I want to disable sorting of items when item is dragged. Only after the drop has been completed the items must sort accordingly.
$( "#sortable" ).sortable({
tolerance: 'pointer',
revert: 'invalid',
forceHelperSize: true,
scroll: true,
forcePlaceholderSize: true,
placeholder: 'ui-state-highlight',
helper: 'clone',
containment: 'parent',
cursor: 'move',
distance: 5,
opacity: 0.3,
});
推荐答案
一种方法是在不同事件期间对占位符位置进行微管理.它导致还原出现问题,但是可能有某种方式可以解决此问题.行为可能不完全相同,但是再次稍作调整,它可能就在那里.无论如何,我的建议:
One way to do it would be to micromanage placeholder position during the different events. It causes a problem with revert, but there's probably a way to resolve this somehow. And the behavior might not be exactly exactly the same, but again, a little tweak and it could be there. Anyway, my suggestion:
$(function () {
$("#sortable").sortable({
tolerance: 'pointer',
//revert: 'invalid',
forceHelperSize: true,
scroll: true,
forcePlaceholderSize: true,
placeholder: 'ui-state-highlight',
helper: 'clone',
containment: 'window',
cursor: 'move',
distance: 5,
opacity: 1,
start: function (event, ui) {
place_prev = ui.placeholder.prev();//get position when selecting item
},
change: function (event, ui) {
place_pos = ui.placeholder.index(); //each change you gather where the placeholder is going
place_prev.after(ui.placeholder);//then you place it back where it started
},
beforeStop: function (event, ui) {
$('li').eq(place_pos).after(ui.item);//before stopping you place item where it was on last change event
},
});
});
http://jsfiddle.net/2mxw14vv/3/
这篇关于jQuery UI可排序-仅在放置事件时排序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文