如何删除添加到可放置div的文本

Question

我创建了一个清除按钮，以在将元素放入可放置div时显示。 问题在于，还创建了该按钮以清除div中的html，并且清除该项目后，我希望按钮淡出。

$('#sortcard, #dropbox, #dropbox1').droppable({accept:'.sorting', hoverClass:'border', tolerance: 'touch',
    drop: function (e, ui){

    $(e.target).append(ui.draggable.html() + '<br/>');
        //can use $(this) or (e.target)
    $("#add_friend").show().fadeOut(12000);
    $(e.target).droppable("destroy");
    $(e.target).append("<input type='button' name='Sub' value='clear'/>");
    }
    });

    $(":button").click(function(){
        $(ui.draggable).remove;
        $(":button").fadeOut(20000)        
    });

然而，正如这里看到的那样，这只是没有发生。 我很想了解为什么我的按钮无法正常工作以及如何解决此问题。 一般而言，任何其他技巧也将不胜感激。

Answer 1

更改

$(":button").fadeOut(20000)

至

$(this).fadeOut(20000)

Answer 2

更新：编辑以删除对“ live”的使用（不建议使用）。

您的点击处理程序正在尝试绑定到尚不存在的元素。 尝试在创建按钮时绑定单击处理程序：

旧：

$(e.target).append("<input type='button' name='Sub' value='clear'/>");}

新：

$(e.target).append($("<input type='button' name='Sub' value='clear'/>")
           .click(function(){
               $(this).parent().empty();
               $(this).fadeOut(20000);
            }));