java对话框的关闭按钮_单击关闭按钮时，在jquery对话框中销毁Div及其内容

当csv数据被拖动到图形选项卡时，我有一个应用程序，数据将在jquery对话框扩展中显示为图形 . 一切正常 . 如果单击关闭按钮，对话框将按预期关闭 . 但是，使用chart.js构建的图形不会被破坏 . 就像我再次将数据拖放到图形选项卡而不刷新页面一样，对话框扩展打开，构建旧图形 . 现在，我想在点击关闭按钮后销毁jquery对话框内的所有div，canvas，graph . 如何制作这个？下面是我的代码？

$("#graph_container").dialog("open")

.dialog({

height: height,

title: data1 + " " + "(1990 January to 2008 December)",

width: width,

resizable: true,

responsive: true,

droppable: true,

close: function(ev, ui) {

graph_myLine.destroy();

$(this).remove();

}

})

.dialogExtend({

"titlebar": 'transparent',

"closable": true,

"minimizable": true,

"minimizeLocation": "right",

"icons": {

"close": "ui-icon-circle-close",

"minimize": "ui-icon-circle-minus",

"restore": "ui-icon-circle-triangle-n"

},

open: function (event, ui) {

$('#graph_container').css('overflow', 'hidden'); //this line does the actual hiding

}

});

如果我运行上面的代码，按下关闭按钮后，如果我再次将数据拖放到图形选项卡，则destroy函数在chart.js中不起作用 . 该图表仍然存在 . 它显示错误为 Uncaught TypeError: Cannot read property 'toDataURL' of null 它在代码的下面一行引发错误

$("#graph_container").droppable({

activeClass: "ui-state-default",

hoverClass: "ui-state-hover",

accept: ":not(.ui-sortable-helper)",

drop: function (event, ui) {

HoldOn.open();

//alert(ui.draggable.text());

// $("#info").html("dropped!");

canvas = document.getElementById('canvas');

if (canvas.toDataURL() !== document.getElementById('blank').toDataURL())