Question

请参阅演示http://jsfiddle.net/nivea75ml/5NhFA/1/。

这里，底部的绿色块可以拖放到黑暗的加里区域。此外，我希望3个块是可排序的，例如，如果Block2首先被拖入深灰色区域，Block3应该移动到Block2的位置。

目前，可排序功能在没有Draggable＆amp;可放置，请在http://jsfiddle.net/nivea75ml/sNnAe/查看。但它不适用于Draggable＆amp;可放置，请参阅http://jsfiddle.net/nivea75ml/5NhFA/1/。

任何人都可以帮助我吗？提前致谢！

Answer 1

听起来您只想将Sortable与连接列表一起使用：http://jqueryui.com/demos/sortable/#connect-lists

我修改了你的第一个jsfiddle：

HTML：

<div class="demo">

    <div id="droppable" class="drp">

    </div>
    <div id="draggableElements" class="drp">
        <div class="draggable">
            <p>Sen1</p>
        </div>
        <div class="draggable">
            <p>Sen2</p>
        </div>
        <div class="draggable">
            <p>Sen3</p>
        </div>

    </div>
</div>

使用Javascript：

$(function() {

            $("#draggableElements, #droppable").sortable({
                    connectWith: ".drp",
                    placeholder: "ui-draggable"
                });

    });

这使得上面的灰色区域也可以排序，这可能或可能不完全符合您的需求。如果您想将可排序项目放入droppable中，并且能够将其重新放入可排序项中，请查看以下内容：jQuery Sortable and Droppable。

可排序无法正常使用draggable和droppable

1 个答案: