拖拽并改变dom中的div的父项 [英] drag drop and change parent of a div in dom

问题描述

在 http://jqueryui.com/draggable/#snap-to

如果我将div拖动到 snaptarget div。

将显示拖动的div将其作为 DOM 中的子元素添加到其中？

我在浏览器上点击f12，看到位置随着拖动而变化，但显示 parent 被拖动，丢弃div不变。

If i drag a div to "snaptarget" div.
Will the dragged div be shown INSIDE it as its child element in the DOM?
I hit f12 on browser and saw the position cordinates changing as I drag but showing that the parent of that dragged,dropped div was unchanged.

我认为同样的可以下载的 http://jqueryui.com / droppable /

I think same happens with droppable http://jqueryui.com/droppable/

有没有办法检查并确定？

Is there a way to check and be sure?

我想要这个功能，因为我想拖动一个div到另一个div，然后知道该div的父母。

推荐答案

p>拖动的元素作为放置目标的子代复制或移植（取决于您为 帮助选项）。

The dragged element is either duplicated or transplanted as a child of the drop target (depending on what you've selected for the helper option).

要更清楚地说明这一点，在droppable元素下面将会包含一个包含可拖动元素的DOM节点。

To state this more explicitly, there will be a DOM node under the droppable element that contains the draggable element.

编辑：

看来我错了。这不是默认行为，但你可以这样做：

It appears I was mistaken. This isn't default behavior, but you could do something like this:

$(".target").droppable({
    accept: '.draggable',
    drop: function(event, ui) {
        $(this).append(ui.draggable);
    }
});
$(".draggable").draggable();

这是一个演示： http://jsfiddle.net/VTHcG/

这篇关于拖拽并改变dom中的div的父项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！