如何删除droppable中的元素以插入更多新元素 - jQuery

Question

我用jQuery做了一个小费率系统，用户可以将数字拖到另一个元素。我希望用户能够拖动新号码，但随后删除用户之前删除的号码（元素）。

现在我只是禁用了droppable但显然停止了这个功能

$('#rate1, #rate2, #rate3, #rate4, #rate5').droppable({
                    accept: ('#drag_rate1, #drag_rate2, #drag_rate3, #drag_rate4, #drag_rate5'),
                    drop: function(ev, ui) { 
                        var numero = ui.draggable.html();
                        //var dedoid = ui.draggable.attr('id');
                        var bkg = ui.draggable.css('background-image');
                        var html = '<div class=\'number_dropped\' style=\'background-image: '+bkg+'\'>'+numero+'</div>';
                        $(this).append(html).hide().fadeIn('slow');
                        $(this).droppable('disable');
                    }
                });

Answer 1

使用以下行删除以前删除的对象：

$(this).find(".dedo_dropped").remove();

所以你的代码将是：

$('#rate1, #rate2, #rate3, #rate4, #rate5').droppable({
    accept: ('#dedo_up, #dedo_down'),
    drop: function(ev, ui) { 
        $(this).find(".dedo_dropped").remove();
        var dedo = ui.draggable.html();
        var bkg = ui.draggable.css('background-image');
        var html = '<div class=\'dedo_dropped\' style=\'background-image: '+bkg+'\'>'+dedo+'</div>';
        $('#dedo_pick').append(html).hide().fadeIn('slow');
        $(this).droppable('disable');
    }
});