刷新頁面時，可拖動元素應停留在停止移動點

Question

當元素（id =「draggable」）停止拖動時，元素的位置將通過「mapDemo.php」發送到數據庫。目前，如果刷新頁面，元素將返回到開始移動點。我想要做的是當頁面刷新時，元素應該停留在停止移動點。

下面是我的代碼，我應該做些什麼來解決這個問題？謝謝你的幫助。

<script type="text/javascript"> 
     $(function() { 
      $("#draggable").draggable({ 
        stop: function(){ 
          var position = $(this).position(); 
          $.ajax({ 
            type:"post", 
            url:"mapDemo.php", 
            data: { top: position.left, left: position.top }, 
            cache:false 
           }); 
         } 
        }); 
     }); 
     </script> 

      <div class="demo"> 
       <div id="draggable" class="ui-widget-content"> 
        <p>Drag</p> 
       </div> 
      </div> 

Answer 1

如果您保存位置，當它被刪除時，您需要在頁面加載時恢復此位置。

即，你可以加入這一行

$('#draggable').css({top:200,left:100}); 

與上，無論你將數據保存到左讀取。