draggable如何snap到新创建的元素上？-灵析社区
codbad我使用jqui中的draggable小部件。 我希望当我的draggable元素拖拽到某个区域后，能产生一个新元素“#block”，并且这个新元素能够被draggable的"snap"所识别 我的代码如下： $("#ball").draggable({ refreshPositions:true, snap:"#block", statr: function(event,ui) { //创建#block元素的函数 createBlock() } }) 我发现#block元素能够正确被创建，并且没有任何拼写错误，但是"#ball"元素仍然无法识别#block元素，也无法吸附上去。我尝试使用refreshPoistion:true来更新draggable元素，但这没有效果。 我应该怎么解决这个问题，或者说，我能通过其他方法来完成我的需求吗？谢谢你的建议和回答！
MaxClick遗憾的是，我最终也没能实现这个功能，我想，这可能与draggable元素的snap的判定有关，或许修改jquery-ui的源文件能解决这个问题，很可惜，我没有这样的能力。
我换用了另一种方式来实现这个功能，他看起来有着与snap一样的外表，或许能够一定程度上解决和我遭遇了同样问题的人：
这分为两部分，我将draggable元素命名为“#ball”，snap元素命名为“#block”
在#block上，我进行了这样的设置：
$("#block").droppable({
tolerance: "pointer",
accept:"#ball",
//球的圆心在鼠标的位置，所以我使用了pointer，当鼠标进入block时，球的圆心也进入了block
over:function(event,ui){
event.stopPropagation()
//通过修改snapping变量令ball的drag事件停止
snapping = true
//获取block的中心，这里的block是一个圆形
var radius = $(this).width()/2
var x = $(this).offset().left + radius
var y = $(this).offset().top + radius
//将ball的圆心移动到这里来
$(ui.draggable).offset({
left: x - ball的半径,
top: y - ball的半径
})
},
drop:function(event,ui){
console.log("球放进了篮子里")
},
//当鼠标移出block时
out:function(event,ui){
event.stopPropagation()
//令drag事件重启
snapping = false
//将ball移动到鼠标的位置来
$(ui.draggable).offset({
left: event.clientX,
top: event.clientY
})
}
})
另一边，我同样对#ball的draggable进行了设置：
$("#ball").draggable({
//我的block是一个在ball开始移动后才创建的对象，也正是因此snap无法起效，这里需要给ball设置refreshPositions:true,才能检测到新创建的block对象
refreshPositions:true,
//以snapping变量限制drag行动
drag: function(event,ui) {
if(snapping != false){
draggingBall(this)
}
else{
//在此时,ball的拖拽事件将不会发生
return 0;
}
},
stop: function(){
console.log("已经结束了！")
}
})
需要提及的是，在我的程序中，ball的移动是借由helper产生，而非ball本身进行的移动，因此，这个代码可能不会在任何情况有效，但我希望它能够作为一种参考