Question

我有一个div，我可以拖动，并试图让用户能够构建一些内容。我做了我想要的大部分工作：

我从左侧工具栏中拖出一个div，它落在右侧的容器中。如果你没有把它放在那个容器里，它会优雅地漂浮回原来的位置。

我的问题是：一旦我放下它，我就不能再移动它将它放在同一容器内的另一个位置。我该如何解决这个问题？

注意：我使用的是jQuery：1.11和jQuery UI 1.10

     // Draggable elements
        $("#draggable_div").draggable({
            cursor : 'move',
            snap : '#target_builder',
            revert : function(event, ui) {
                $(this).data("uiDraggable").originalPosition = {
                    top : 0,
                    left : 0
                };
                return !event;
            },
            stop : function() {
        // do I need to re-initialize it here?  
            }
        });
        $("#target_builder").droppable();


<div>
    <div>
        <div id="draggable_div" style="color: #fefefe; background: #222; width: 100px; height: 100px;">
            <p>Div</p>
        </div>
    </div>
    <div>
        blank content
    </div>
</div>

修改：

jsfiddle：http://jsfiddle.net/KbQDQ/

它似乎对她有用，但不是我的真实代码...嗯...

Answer 1

我认为

return !event;

＆安培;

stop : function() {
                 $("#draggable_div").draggable( "destroy" );
            }

发一些错误请将其删除＆amp;再试一次

Answer 2

如果你删除

return !event;

元素将留在你离开的地方:) 这是正确的代码：

// Draggable elements
    $("#draggable_div").draggable({
        cursor : 'move',
        snap : '#target_builder',
        revert : function(event, ui) {
            $(this).data("uiDraggable").originalPosition = {
                top : 0,
                left : 0
            };

        },
        stop : function() {
    // do I need to re-initialize it here?  
        }
    });
    $("#target_builder").droppable();

Answer 3

我明白了。我正在使用Twitter引导程序框架。我删除了这些类（上面未显示）并且一切正常。

无法重新定位可拖动元素

3 个答案: