jQuery删除div

Question

我有以下脚本

jquery：

<script type="text/javascript">  
    $(function() {  
    $(".column").sortable(  
        { connectWith: '.column' },  
        { handle: '.widget-header' },  
    });  

    $(".widget").addClass("ui-widget ui-widget-content ui-helper-clearfix ui-corner-all")  
        .find(".widget-header")  
            .addClass("ui-widget-header ui-corner-all")  
            .prepend('<span class="ui-icon ui-icon-minusthick"></span>')  
            .end()  
        .find(".widget-content");  

        $(".widget-header .ui-icon").click(function() {  
            $(this).toggleClass("ui-icon-minusthick").toggleClass("ui-icon-plusthick");  
            $(this).parents(".widget:first").find(".widget-content").toggle();  
        });  

        $(".column").disableSelection();  
});  
</script>

html：

<div class="divWidgets">
    <div class="column" id="column_1">
        <div class="widget" id="Widget_1">
            <div class="widget-header" id="Widget_1_Header">widget one</div>
            <div class="widget-content" id="Widget_1_Content">widget one content goes here</div>
        </div>
        <div class="widget" id="Widget_0">
            <div class="widget-header" id="Widget_0_Header">widget zero</div>
            <div class="widget-content" id="Widget_0_Content">widget zero content goes here</div>
        </div>
    </div>
    <div class="column" id="column_2">
        <div class="widget" id="Widget_3">
            <div class="widget-header" id="Widget_3_Header">widget three</div>
            <div class="widget-content" id="Widget_3_Content">widget three content goes here</div>
        </div>
        <div class="widget" id="Widget_5">
            <div class="widget-header" id="Widget_5_Header">widget five</div>
            <div class="widget-content" id="Widget_5_Content">widget five content goes here</div>
        </div>
    </div>
</div>

如您所见，此脚本在窗口小部件上放置一个“减号”按钮，这将在单击时最小化相应的窗口小部件。如何用“删除”替换这个“减号”图标，点击后将完全删除相应的div？

Answer 1

添加删除链接替换

.prepend('<span class="ui-icon ui-icon-minusthick"></span>')

与

.prepend('<span class="ui-icon ui-icon-minusthick">delete</span>')

将点击功能更改为

$(".widget-header .ui-icon").click(function() {   
   $(this).parents(".widget:first").find(".widget-content").remove();
   $(this).remove();   
});

您必须删除小部件内容以及删除链接。