我有一个 div,我可以将其拖动到其他 div,并且它工作正常。
但使用 helper: 'clone' 时,可以拖动 div,但 droppable 不起作用。
你知道如何解决这个问题吗?
jquery:
$(function () {
$(".draggable").draggable({ helper: 'clone', revert: 'invalid' });
$(".droppable").droppable({
accept: ".draggable"
});
});
最佳答案
我认为您正在寻找http://jsfiddle.net/p21z4jy0/2/
$(function () {
$(".draggable").draggable({ helper: 'clone', revert: 'invalid' });
$(".droppable").droppable({
accept: function(drag) {
var dropId = $(this).attr('data-id');
var dragId = $(drag).attr('data-id');
return dropId === dragId;
},
drop: function (event, ui) {
$('.droppable').append(ui.draggable);
}
});
});
.draggable{
width:100px;
border: 1px solid green;
}
.droppable {
width: 300px;
height: 100px;
margin: 10px;
border: 1px solid green;
}
.draggable {
height:50px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/i18n/jquery-ui-i18n.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="draggable" data-id='a'>draggable a</div>
<div class="droppable" data-id='a'>droppable a</div>
关于javascript - jquery 克隆不适用于 droppable,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33925414/