Question

我有一个div，我可以拖到其他div，它的工作正常。

但是有了助手：＆＃39;克隆＆＃39;，它可以拖动div，但是droppable不能正常工作。

你知道如何解决这个问题吗？

jquery的：

$(function () {
    $(".draggable").draggable({ helper: 'clone', revert: 'invalid' });
    $(".droppable").droppable({ 
        accept: ".draggable"
    });
});

工作示例：http://jsfiddle.net/p21z4jy0/

Answer 1

我认为你正在寻找http://jsfiddle.net/p21z4jy0/2/

＆＃13;

$(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);
        }
    });
});

＆＃13;

.draggable{
    width:100px;
    border: 1px solid green;
}
.droppable {
    width: 300px;
    height: 100px;
    margin: 10px;
    border: 1px solid green;
}
.draggable {
    height:50px;

}

＆＃13;

<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>

＆＃13;

jquery clone无法处理droppable

1 个答案: