我想安裝somme種拖放使用JQuery UI的wysiwyg編輯器。JQuery Draggable Droppable和可以同時排序DOM操作
我已成功設置元素,但他們有一個奇怪的行爲。
由於持續的閃爍,對物品進行分類幾乎是不可能的。
設置我的拖拽元素是這樣的:
el.draggable({
containement:'.main-form-container',
revert: "invalid",
connectToSortable: '.sortable'
}).disableSelection();
如果我不把它設置爲可拖動的排序將放置佔位符本身!爲什麼?
有時候,一個元素被放入另一個元素時,它會變成一個可拖動的元素,並且似乎被粘在一起。儘管這似乎與固定覆蓋排序更新:
update: function (event, ui) {
$(ui.item).css({
position: 'relative',
top:0,
left:0,
width: 'auto'
});
// init droppable draggable and sortable on this item
setupDandD($(ui.item));
}
和setupDandD方法:
setupDandD($('.form-container'));
function setupDandD(el) {
el.draggable({
containement:'.main-form-container',
revert: "invalid",
connectToSortable: '.sortable'
}).disableSelection();
el.droppable({
accept: '[data-section="toolbox"]',
greedy: true,
hoverClass: 'droppable-hovered',
drop: handleDrop
}).disableSelection();
el.filter('.sortable').sortable({
tolerance:'pointer',
containement:'.main-form-container',
connectWith: ".sortable:not(#" + $(this).id + ")",
revert: 'invalid',
helper: function() {
return $(this);
},
update: function (event, ui) {
console.log('here');
$(ui.item).css({
position: 'relative',
top:0,
left:0,
width: 'auto'
});
setupDandD($(ui.item));
}
}).disableSelection();
};
我想我需要一些皮卡事件某處的排序,但我相當現在失去...