2

我正在使用 jQuery draggable，droppable以便将内容元素拖放到页面元素上：

<h2>Page</h2>

<div id='page-content'>

</div>

<div id='content-elements'>
  <div id='text-element' class='content-element'>Text</div>
  <div id='date-element' class='content-element'>Date</div>
</div>​

我的可拖动 JS 如下所示：

$elements.draggable({
  revert: true
});

我在那里的原因revert是我希望内容元素返回到元素列表并将“重复”添加到页面中。

我尝试将这个 js 用于 droppable （使用咖啡脚本创建）：

$('#page-content').droppable({
  drop: function(event, ui) {
    var $element, $me;
    $me = $(this);
    $element = $(ui.draggable);
    console.log($element.clone(false));
    return $element.clone().appendTo($me);
  }
});

这样做是获取被拖动的 ui 元素，尝试克隆它，然后将其附加到页面。

然而，这不起作用！即使我可以从 ui.draggable 中获取 div 等。

我创建了一个 jsfiddle 来说明问题：http: //jsfiddle.net/sw4Gc/2/

为什么哦为什么？

4

1 回答 1

5

元素在相对位置且位于元素外部的状态下被克隆。您必须删除元素样式： 

var $newElement = $element.clone();
$newElement.attr('style', '');
$newElement.appendTo($me);
于 2012-11-19T11:20:15.323 回答