Javascript jquery可拖动/可拖放更改快照

我正在尝试创建一系列拖放div。 一旦删除了div1，我将创建一个新div，并将其捕捉到一个新位置。 但是，当删除div1并拖动div2时，捕捉位置保持不变： （）

var trackID=“path0”；
var trackType=“a”；
$（'.map轨迹框'）。可拖放({
宽容：“触摸”，
drop：函数（事件、用户界面）{
//回家
$（#trackDragger'）。设置动画（{top:'30px'，left:'20px'}，500）；
}
});
$（'#'+trackID）.可拖放({
宽容：“触摸”，
drop：函数（事件、用户界面）{
//就位
var pos=$（'#'+trackID）.position（）；
$（#trackDragger'）。动画（{top:pos.top，left:pos.left}，500，function（）{
$（“#draggerBox”）。追加（“”）；
$（#trackDragger'）.css（{顶部：30px，左侧：20px'}，500）；
$（'#trackDragger'）.attr（'class'，'d'）；
$（“#”+trackID）.removeClass（'ui-droppable'）；//我试图删除添加的类，并将其添加到新元素中，但没有成功
如果（trackID==“path0”）{
trackID=“路径1”；
}else if（trackID==“path1”）{
trackID=“路径2”；
trackType=“d”；
}else if（trackID==“path2”）{
trackID=“path3”；
trackType=“e”；
}
$（'#'+trackID）.addClass（'ui-dropable'）；
});
}
});
$（'#trackDragger'）。可拖动({
还原：“无效”，
开始：功能（事件、用户界面）{
$（'#trackDragger'）.attr（'class'，trackType）；
},
snap:“#”+trackID，//即使trackID被更改为path1、path2等，也会保持捕捉到初始div（path0）
快照模式：“内部”，
停止：函数（）{
var dragPos=$（'#trackDragger'）.position（）；
if（dragPos.left<101&&dragPos.top<91）{
$（'#trackDragger'）.attr（'class'，'d'）；
}
//$（this）.draggable（'option'，'revert'，'invalid'）；
}
});

上面的操作很好，但是被拖动的元素一直捕捉到path0（初始可拖动div）。 是否仍然需要强制创建新的捕捉位置

---

谢谢你

至于你提到的小提琴，你把

droppable

事件只绑定到一个元素上。就是

$('#'+trackID) // Your variable don't change from "path0" to any other.

据我所知，您希望其他黑匣子也具有可拖放事件绑定

只需在

droppable

部分将代码更改为以下内容

$('.path').droppable({});

这会将事件绑定到页面中的每个

.path

元素

查看更新的小提琴。

我发现添加：

$('#trackDragger').draggable("option", "snap", "#"+trackID);

将强制它捕捉到新元素。 进一步利用

$('#'+trackID).droppable()...

---

将失败，因为它显然需要重新初始化，以便使用不同的元素作为可拖放元素。

您能为您的问题做一个小摆设，以便我们能更好地了解您的问题！提琴手：嗨，迪马尔。问题是，捕捉仍然只发生在box1处。它应该捕捉到box1，然后是box2，然后是box3如果你看第24-32行，我会在那里更改trackID变量。我怀疑可能需要对draggable进行某种形式的重新初始化？如果您可以将行号44更改为

snap:'.path'，

，那么它将捕捉到每个元素，但会接受下一个应该接受该项的项，而不是重新初始化插件！我已经更新了小提琴。

$('#'+trackID).droppable()...