拖放后可拖动和调整大小
Draggable and Resizable after drop
如何在放置后拖动元素并调整元素大小。
$(function() {
$(".selectField").draggable({
revert: 'invalid',
helper: "clone",
});
$("#fuller").droppable({
drop: function(event, ui) {
var draggable = ui.draggable;
draggable = draggable.clone();
draggable.appendTo("#fuller");
}
});
});
<div id="panel">
<div id="resizable" class="selectField">
<label for="#input">Name</label>
<input type="text" id="input" />
</div>
</div>
<div id="fuller"></div>
当我将 draggable()
和 resizable()
添加到删除的元素时,它不起作用。
我该如何解决?
拖放完成后,您必须使克隆的可拖动元素可调整大小
$(function() {
$(".selectField").draggable({
revert: 'invalid',
helper: "clone",
});
$("#fuller").droppable({
drop: function(event, ui) {
var draggable = ui.draggable;
var dragged = draggable.clone();
dragged.appendTo("#fuller");
dragged.resizable({containment: '#fuller'})
}
});
});
<div id="panel">
<div id="resizable" class="selectField">
<label for="#input">Name</label>
<input type="text" id="input" />
</div>
</div>
<div id="fuller"></div>
如何在放置后拖动元素并调整元素大小。
$(function() {
$(".selectField").draggable({
revert: 'invalid',
helper: "clone",
});
$("#fuller").droppable({
drop: function(event, ui) {
var draggable = ui.draggable;
draggable = draggable.clone();
draggable.appendTo("#fuller");
}
});
});
<div id="panel">
<div id="resizable" class="selectField">
<label for="#input">Name</label>
<input type="text" id="input" />
</div>
</div>
<div id="fuller"></div>
当我将 draggable()
和 resizable()
添加到删除的元素时,它不起作用。
我该如何解决?
拖放完成后,您必须使克隆的可拖动元素可调整大小
$(function() {
$(".selectField").draggable({
revert: 'invalid',
helper: "clone",
});
$("#fuller").droppable({
drop: function(event, ui) {
var draggable = ui.draggable;
var dragged = draggable.clone();
dragged.appendTo("#fuller");
dragged.resizable({containment: '#fuller'})
}
});
});
<div id="panel">
<div id="resizable" class="selectField">
<label for="#input">Name</label>
<input type="text" id="input" />
</div>
</div>
<div id="fuller"></div>