Javascript jQuery UI可拖动：放置后在网格中的位置

绑定时使用

网格：[90,83]

使元素仅在指定的网格中移动。我试图让它自由移动（因为它没有

网格集），然后，当用户停止拖动元素时，将其放置在网格中

例如，在你的Android智能手机上，当你在主屏幕上重新排序图标时，你可以将它们拖动到你喜欢的任何地方，释放后它们会粘在网格上

到目前为止，我尝试了以下JS代码：

$(".home-item.desktop-icon:last-child").draggable({
    //grid: [90, 83],
    containment: "parent",
    stop: function (event, ui) {
        y = ui.position.top,
        x = ui.position.left,
        _this = this;
        if ((x - 10)%83 >= 42) {
            posX(x-(x%83) + 93);
        }
        else {
            posX(x-(x%83) + 10);
        }
        if ((y - 10)%90 >= 45) {
            posY(y-(y%90) + 100);
        }
        else {
            posX(y-(y%90) + 10);
        }
        function posX (f) {
            $(_this).css("top", f + "px");
        }
        function posY (f) {
            $(_this).css("left", y + "px");
        }
    }
});

但是，不知道为什么这根本不起作用。我该怎么办？
下面是一个基于我的评论的示例


$（函数（）{
$（“.draggable”）.draggable({
遏制：“家长”
});
$（“#snaptarget”）。可拖放({
接受：“.draggable”，
drop：函数（e、ui）{
var cPPos=ui.position；
var cOPos=ui.offset；
var cPosOff={
顶部：数学圆（cOPos.top）%90，
左：数学圆（cOPos.左）%83
};
var sPos={
顶部：数学圆（cOPos.top），
左：数学圆（cOPos.left）
};
日志（“已删除”、CPPO、cOPos、cPosOff、SPO）；
var$item=ui.draggable；
如果（cPosOff.top>0&&cPosOff.top<70）{
sPos.top=sPos.top-cPosOff.top；
log（“下拉列表：+cOPos.TOP+”降低到“+sPos.TOP”）；
}否则{
sPos.top=sPos.top+（90-cPosOff.top）；
log（“下拉列表：+cOPos.TOP+”上升到“+sPos.TOP”）；
}
如果（cPosOff.left>0&&cPosOff.left<61）{
sPos.left=sPos.left-cPosOff.left；
log（“左下角：+cOPos.LEFT+”左下角到“+sPos.LEFT”）；
}否则{
sPos.left=sPos.left+（83-cPosOff.left）；
日志（“左下角：+cOPos.LEFT+”右下角到“+sPos.LEFT”）；
}
$item.appendTo（$（this））.css({
保证金：0，
位置：“绝对”，
顶部：sPos.top+“px”，
左：sPos.left+“px”
});
}
});
});
。拖动区域{
最小高度：300px；
}
.拖拉{
宽度：80px；
高度：80px；
显示：内联块；
利润率：0 10px 10px 0；
字体大小：.9em；
}
.ui窗口小部件头p，
.ui小部件内容p{
保证金：0；
}
#snaptarget{
高度：173像素；
位置：相对位置；
}



A

B

C

D

E

您需要在拖放中执行此操作。一旦拖动的项目被附着，请调整其位置。如果你愿意，你甚至可以对“快照”设置动画。这也不是一个最小的、完整的、可验证的例子。请提供一份：