dragdrop保存定位问题

时间:2012-04-04 11:41:05

标签: php javascript jquery html css

我目前正在使用一个dragdrop脚本并保存(位置:相对)div的左侧和顶部坐标。我的问题是,当我重新加载时,它们被保存的坐标并不总是相同的位置(放置)。

div位于具有给定高度和宽度的容器内(此容器限制div仅在其内部移动 - 周边div)

所以我试图让坐标只能在DIV中的工作/空间而不是整个页面。

我正在使用PHP获取该页面的正确div /小部件,它提供了widget类(背景和其他基于css的变量)

如果有多个特定小部件

,所有小部件都有自定义ID

这是我的主要代码:

<?
    $load = mysql_query("SELECT * FROM `widgets` WHERE `page`='1' AND `show`='yes'")or die(mysql_error());
    while($widget = mysql_fetch_array($load)){
?>
<div id="<? echo $widget['id']; ?>" style="left: <? echo $widget['left']; ?>px; top: <? echo $widget['top']; ?>px;" class="<? echo $widget['widgetid']; ?> draggable ui-widget-content" onmouseup="find('<? echo $widget['id']; ?>','1')"> </div>
<? } ?>

这是我保存的Javascript:

function find(id, page){
    var position = $("#"+id).position();
    $.ajax({
        type: "POST",
        url: "save.php",
        data: "l=" + position.left + "&t=" + position.top + "&request=" + page + "&w=" +id,
        success: function(msg){
            var element = document.getElementById(id);
            element.style.opacity = "1.0";
        }
    });
}
我离开了, t是顶部, 两者都发送了onmouseup(w = widgetid,request = pageid)

变量正在保存到数据库中,而不是正确放置在页面上(向右移动或略微向上移动)

非常感谢任何帮助!

提前谢谢

1 个答案:

答案 0 :(得分:0)

.position()上的jQuery docs所述:

  

获取集合中第一个元素的当前坐标   匹配元素,相对于偏移量父级

如果你继续阅读,那就说

  

将此与.offset()进行对比,后者检索当前位置   相对于文档