无法重新定位可拖动元素
Unable to re-position a draggable element
我有一个可以拖动的div,并试图让用户能够构建一些内容。我让它做我想做的大部分事情:
我从左边的工具栏拖动一个div,它落在右边的容器中。如果你不把它放在那个容器里,它就会优雅地浮回原来的位置。
我的问题是:一旦我把它掉了,我就不能再把它移到同一个容器里的另一个地方。我该怎么解决这个问题?
注意:我使用的是jQuery:1.11和jQuery UI 1.10
// Draggable elements
$("#draggable_div").draggable({
cursor : 'move',
snap : '#target_builder',
revert : function(event, ui) {
$(this).data("uiDraggable").originalPosition = {
top : 0,
left : 0
};
return !event;
},
stop : function() {
// do I need to re-initialize it here?
}
});
$("#target_builder").droppable();
<div>
<div>
<div id="draggable_div" style="color: #fefefe; background: #222; width: 100px; height: 100px;">
<p>Div</p>
</div>
</div>
<div>
blank content
</div>
</div>
编辑:
jsfiddle:http://jsfiddle.net/KbQDQ/
这似乎对她有用,但在我的真实代码中不是。。。hmmm…
如果删除
return !event;
元素将停留在您离开的位置:)这是正确的代码:
// Draggable elements
$("#draggable_div").draggable({
cursor : 'move',
snap : '#target_builder',
revert : function(event, ui) {
$(this).data("uiDraggable").originalPosition = {
top : 0,
left : 0
};
},
stop : function() {
// do I need to re-initialize it here?
}
});
$("#target_builder").droppable();
我想明白了。我使用的是Twitter引导程序框架。我删除了类(上面没有显示),所有的工作都很好。
我认为
return !event;
&
stop : function() {
$("#draggable_div").draggable( "destroy" );
}
犯了一些错误,请删除它&重试一次
相关文章:
- 如何使元素在可拖动元素内可单击
- 拖动开始时更改可拖动元素的大小
- 无法为HTML5中具有画布和图像的可拖动元素设置“拖动图像”
- 具有可拖动元素的HTML到PDF
- 可缩放容器鼠标上的可拖动元素在创建时从辅助对象上浮动
- 删除所有可拖动元素后如何显示消息
- 将可拖动元素与从父项位置开始的网格对齐
- 拖动元素时,如何获取要替换的元素的位置
- 将id为X的可拖动元素拖放到id为Y的容器
- 在没有jQuery的情况下拖动元素
- 可拖动元素在悬停在另一个'It’s draggable
- 拖动时更改HTML5可拖动元素的“克隆”文本
- Javascript:当元素中有<选择>时,可拖动元素搞砸了
- 是否有可能知道 jquery 可拖动元素将恢复到哪里
- 如何将键控事件与 JQuery-ui 可拖动元素一起使用
- jQuery UI 可拖动元素位于其他可拖动元素下
- 从拖动元素中获取 HTML5 自定义数据属性
- 使用 D3.js 拖动元素时滚动
- 同步两个可拖动元素的位置
- 如何从可拖动元素中删除项目符号