带有可放置属性的jquery动态div添加答案

【问题标题】：jquery dynamic div addition with droppable attribute带有可放置属性的jquery动态div添加
【发布时间】：2014-02-05 20:36:44
【问题描述】：

我正在尝试构建一个布局页面。此页面有 1 个主面板。如果用户单击“创建新选项卡”，我想构建一个新的 div，并使该 div 可放置。在这个淡化的例子中。我想点击“创建新标签”，然后能够将“其他” div 放入其中。

看我的小提琴： Fiddle

  $('#newTab').click (function()
  {
    i++;
    var div = $('<div class="drop"/></div>').appendTo('#mainBucket');
    div.attr('id', 'holdy'+i);
    div.addClass('tabModule drop');
    div.html('hello');
  });

【问题讨论】：

标签： javascript jquery html jquery-ui jquery-ui-droppable

【解决方案1】：

您必须让每个新的 div 都可以单独放置。创建新 div 后，您需要应用 jQuerys 可放置方法。 Dropable 不适用于将来创建并与您的选择器匹配的元素，因此您必须自己执行此操作。

var newDiv = jQuery('<div class="drop" />').droppable().attachTo('body')

我在这里修改了您的示例：http://jsfiddle.net/Valtos/dQzy5/7/

【讨论】：