Is it possible to remove all dropped 'items' on a droppable div by pressing a single button?
Thanks, LS
$("#wrapper").droppable({
accept: '.shape',
drop: function(event, ui)
{
$(this).append($(ui.helper).clone());
$("#wrapper .shape").addClass("item");
$(".item").removeClass("ui-draggable shape");
$(".item").draggable({
containment: '#wrapper'
});
}
});
$("#trash").droppable({
accept: '.item',
drop: function(event, ui)
{
$(ui.draggable).remove();
}
});
I've created a div called trash, so when the items are dropped into this they are removed. I need similar functionality to this but when a button is pressed it removes all of the dropped shapes without having to drag them onto the trash div.
Simply remove all elements with an item
class:
$('#someButton').click(function() {
$("#wrapper .item").remove();
});
Sidenote:
Instead of selecting the dropped .shape
element again with $("#wrapper .shape")
, you could do
ui.helper.clone() // ui.helper is already a jQuery object
.appendTo(this)
.toggleClass("item ui-draggable shape");
.draggable({
containment: '#wrapper'
})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.