javascript - 克隆不应该在子 div 中工作

Question

我这里遇到一个问题...第一个和第二个有两个 div。我刚刚克隆了第一个 div，它可拖动到可放置的第二个 div。我的要求是将克隆的div也拖到第二个div中。问题是第二个div中的div，当我拖动时也会被克隆...

代码是

<div class="first"></div>
<div class="second"></div>
<script type="text/javascript">
    $('.first').draggable({
        helper: 'clone'
    });
    $('.second').droppable({
        drop: function (event, ui) {
            $(this).append(ui.draggable.clone());
            $('.second .first').draggable({
                drop: function (event, ui) {
                    $(this).remove().clone();
                }
            });
        }
    });

</script>

Answer 1

您可以向克隆添加一个类，然后在再次克隆之前检查删除的对象是否具有该类:

$('.second').droppable({
    drop: function (event, ui) {
        if (!ui.draggable.hasClass('clone')) {
            $(this).append(ui.draggable.clone().addClass('clone'));
            $('.second .first').draggable({
                drop: function (event, ui) {
                    $(this).remove().clone();
                }
            });
        }
    }
});

Example