当从DOM中删除对象时，删除了使用document.on定义的处理程序

Question

我的SPA上有一些严重的内存泄漏。我设法定位泄漏的位置，但我无法修复它。我有这样的代码：

$(document).on("click.widget", ".glyphicon-collapse-down", function (e) {
    var contentElement = $(e.target).closest(".widget").find(".widget-body");
    $(e.target)
        .removeClass("glyphicon-collapse-down")
        .addClass("glyphicon-collapse-up");
    kendo.fx(contentElement).expand("vertical").stop().play();
});

我可以在单个页面上生成小部件，所以我需要按钮才能拥有处理程序，即使它们还不存在（每个小部件都带有一个按钮组）。当我从当前页面切换到另一个页面时，我从页面中删除所有内容并加载带有ajax请求的新页面。而这里出现了内存泄漏。我怀疑它可能在于处理程序没有被正确删除。

编辑：当我在应用中不包含此脚本时，泄漏会变得非常小：

//expand the widget
$(document).on("click.widget", ".glyphicon-collapse-down", function (e) {
    var contentElement = $(e.target).closest(".widget").find(".widget-body");
    $(e.target)
        .removeClass("glyphicon-collapse-down")
        .addClass("glyphicon-collapse-up");
    kendo.fx(contentElement).expand("vertical").stop().play();
});
//collapse the widget
$(document).on("click.widget", ".glyphicon-collapse-up", function (e) {
    var contentElement = $(e.target).closest(".widget").find(".widget-body");
    $(e.target)
        .removeClass("glyphicon-collapse-up")
        .addClass("glyphicon-collapse-down");
    kendo.fx(contentElement).expand("vertical").stop().reverse();
});
//remove the widget and updating the layout accordingly
$(document).on("click.widget", ".glyphicon-remove", function (e) {
    var contentElement = $(e.target).closest(".widget");
    var ancestor = $(contentElement).parent();
    var rightColumn = $("#right-column");
    var mainColumn = $("#main-column");
    kendo.unbind(contentElement);
    kendo.destroy(contentElement);
    $(contentElement).fadeOut().remove();
//    //Widget layout modification on remove
    if ((rightColumn.items().length - 1 == 0) && (ancestor.attr("id") == "right-column")) {
        if (mainColumn.items().length == 1) {
            $("#main-column").removeClass("col-lg-6").hide().addClass("col-lg-12").fadeIn();
        }
        else if (mainColumn.items().length > 1) {
            var firstWidget = mainColumn.items().last();
            $(firstWidget).hide().prependTo("#right-column").fadeIn();
        }
    }
    if ((mainColumn.items().length - 1 == 0) && (ancestor.attr("id") == "main-column")) {
        if (rightColumn.items().length == 1) {
            $("#right-column").removeClass("col-lg-6").hide().addClass("col-lg-12").fadeIn();
        }
        else if (rightColumn.items().length > 1) {
            var firstWidget = rightColumn.items().last();
            $(firstWidget).hide().prependTo("#main-column").fadeIn();
        }
    }
});
//Enable the widget fullscreen
$(document).on("click.widget", ".widget-fullscreen-on", function (e) {
    var contentElement = $(e.target).closest(".widget");
    contentElement.addClass("fullscreen");
    $(e.target)
            .removeClass("glyphicon-resize-full")
            .removeClass("widget-fullscreen-on")
            .addClass("glyphicon-resize-small")
            .addClass("widget-fullscreen-off");
});
//Disable the widget fullscreen
$(document).on("click.widget", ".widget-fullscreen-off", function (e) {
    var contentElement = $(e.target).closest(".widget");
    contentElement.removeClass("fullscreen");
    $(e.target)
            .removeClass("glyphicon-resize-small")
            .removeClass("widget-fullscreen-off")
            .addClass("glyphicon-resize-full")
            .addClass("widget-fullscreen-on");
});
//Inserts a widget into the page content and modifies the layout accordingly
function insertWidget(jtext) {
    jtext.attr("id", "");
    if (($('#main-column').items().length == 0) && ($('#right-column').items().length == 0)) {
        if ($("#main-column").hasClass("col-lg-12")) {
            $(jtext).hide().prependTo('#main-column').fadeIn();
        }
        else if ($("#right-column").hasClass("col-lg-12")) {
            $(jtext).hide().prependTo('#right-column').fadeIn();
        }
    }
    else if ($("#main-column").hasClass("col-lg-12")) {
        $("#main-column").removeClass("col-lg-12").addClass("col-lg-6");
        $(jtext).hide().prependTo('#right-column').fadeIn();
    }
    else if ($("#right-column").hasClass("col-lg-12")) {
        $("#right-column").removeClass("col-lg-12").addClass("col-lg-6");
        $(jtext).hide().prependTo('#main-column').fadeIn();
    }
    else if ($('#right-column').items().length < $('#main-column').items().length) {
        $(jtext).hide().prependTo('#right-column').fadeIn();
    }
    else {
        $(jtext).hide().prependTo('#main-column').fadeIn();
    }
}