我试图让放置的元素在父容器中既可拖动又可调整大小。
这是我的CSS：
.toolitem {padding:5px 10px;background:#ececec;border:1px solid silver}.labelitem {width:114px;padding:10px 5px;color:#222;background:#fff;border:1px solid silver}
这是我的html：
<header>
<ul>
<li><div id="atool" class="toolitem droppable">A</div></li>
<li><div id="btool" class="toolitem droppable">B</div></li>
</ul>
<div class="clear"></div></header><section id="container"/>
这是我的 JS：
$(".toolitem").draggable({
opacity:1,
tolerance:'fit',
helper:'clone'
});
$("#container").droppable({
accept:'.droppable',
drop: function (event, ui) {
// Check for new or already dropped element
var dropped = ui.draggable.data("dropped");
if (dropped == null && dropped != "1") {
// Create new element only once
var label = $('<div class="labelitem droppable">[Label]</div>');
// Set flag as dropped
label.data("dropped", "1");
// Make new element draggable within parent
label.draggable({ containment: 'parent', grid: [2, 2], helper: 'original' });
// Make new element resizable within parent
label.resizable({ containment: 'parent' });
// Append new element to parent
label.appendTo(this);
}
}
});
上面的代码执行得很好，除了删除的 div 不可调整大小。请帮忙。