我正在尝试建立一个网站,用户可以将一些项目(div中的一个项目)拖动到页面上的其他div.它不是一张桌子左右,只是在页面的某个地方划分.
使用html5拖放它运行良好,现在我尝试为移动设备执行此操作.我可以将项目拖动到div,将它们放在那里并阻止这个dropzone,因为只有一个元素应该在dropzone中.我也可以将这个元素拖到另一个div或页面上的其他地方(如果我犯了一个错误,可放置区域只能在第一次删除div时工作)但是我不能在div中删除另一个现在为空的项目再次.
如何再次启用Dropzone？
如果一个被拖到另一个div上,是否有可能改变两个div的位置？
这是我的代码的相关部分:
<script type="text/javascript">
$ (init);
function init() {
$(".dragzones").draggable({
start: handleDragStart,
cursor: 'move',
revert: "invalid",
});
$(".dropzones").droppable({
drop: handleDropEvent,
tolerance: "touch",
});
}
function handleDragStart (event, ui) {}
function handleDropEvent (event, ui) {
$(this).droppable('disable');
ui.draggable.position({of: $(this), my: 'left top', at: 'left top'});
ui.draggable.draggable('option', 'revert', "invalid");
}
</script>
<body>
<div id="alles">
<div class="dropzones" id="zone1"><div class="dragzones" id="drag1">Item 1</div></div>
<div class="dropzones" id="zone2"><div class="dragzones" id="drag2">Item 2</div></div>
<div class="dropzones" id="zone3"><div class="dragzones" id="drag3">Item 3</div></div>
<div class="dropzones" id="zone4"><div class="dragzones" id="drag4">Item 4</div></div>
<div class="dropzones" …