Question

每次删除拖动时，

位置top增加约10px或恢复。例如，

我第一次将苹果从.sidebox拖到.dropbox，苹果最终会这样：

<div class="apple ui-draggable selected" style="position: relative; left: 0px; top: 10.1px;"></div>

第二次，我将苹果从.dropbox拖回到.sidebox或只是稍微移动它并让它恢复，苹果是这样的，注意top增加10：

<div class="apple ui-draggable selected" style="position: relative; left: 0px; top: 20.1px;"></div>

重复拖放，top变得越来越大：

<div class="apple ui-draggable selected" style="position: relative; left: 0px; top: 30.1px;"></div>
...

所以我亲爱的苹果正在离开这个位置，我想要它直到它说再见到页面。是什么导致这个？

简化代码：

    // drag and drop
    $( ".apple" ).draggable({ 
        revert:true
    });

    $( ".dropbox" ).droppable({
        drop: handleDropbox
    });

    $( ".sidebox" ).droppable({
        drop: handleSidebox
    });

    function handleDropbox(event, ui) {
        $(this).append(ui.draggable);
        $(this).droppable( 'disable' );
    }

    function handleSidebox(event, ui) {
       ui.draggable.parent().droppable('option', {'disabled':false});
       $(this).children('h4').after(ui.draggable); 
    }

编辑：无法在jsfiddle中复制它，还没弄清楚为什么......

请注意.sidebox位置是固定的，可能有帮助吗？

Answer 1

请检查小提琴

http://jsfiddle.net/4gFqh/7/

$( ".apple" ).draggable({ 
    revert:function(event,ui){  
        s=s+10;
        alert("my top position is "+s);
        $(this).data("draggable").originalPosition = {
                          top:s,
                          left:0
                                         };
                    return !event;
                             },
});

Answer 2

revert : function(event , ui)
    {

      if(event){
        return event;
      }
      else
        return !event;
    }

一个令人困惑的问题，我猜您想返回到原始位置，无论如何都会恢复到原始位置。添加

 $("element").draggable(function({
// add revert here 
});

JQuery UI：draggable不会恢复到原始位置

2 个答案: