刷新页面时，可拖动元素应保留在停止移动点

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});

在您将数据保存到的任何位置读取顶部和左侧。