我有一个基本的模态对话框，其中包含一个 TinyMCE 实例。每次打开时都会动态创建此模态对话框，并在对话框关闭时销毁和删除对话框及其元素。
第一次打开对话框时一切正常。表单加载（ajax调用），表单应用了 uniform 样式，并将 TinyMCE 应用于文本区域。我可以正常执行所有操作。随后每次打开表单时，过程重复，不同之处在于尽管 TinyMCE 应用于文本区域，但我无法再其中输入内容。
这是在链接点击时触发的方法：
当模板加载时，最后几行会将TinyMCE应用于加载的表单中的文本区域：
通过一些步骤的调试和 FireBug，我确认了编辑器已被销毁，然后文本区域被完全删除，在销毁对话框并移除 div 前。即便如此，在重新初始化对话框后，我仍然无法在新的 TinyMCE 实例中键入内容，底层代码显示为上次更新的内容。它似乎与之前元素的不正确销毁无关。
更新：Patricia 的最后建议是将加载表单到对话框的 ajax 调用移到.load() 方法中，然后创建对话框。我尝试了这个方法，事情很快就变得糟糕了。远程内容包含必须执行的脚本，因此在 .ajax() 方法上使用 script 数据类型。.load() 方法没有这个选项，而且它非常不喜欢这样做。所以现在我不知道该尝试什么了。
第一次打开对话框时一切正常。表单加载（ajax调用），表单应用了 uniform 样式，并将 TinyMCE 应用于文本区域。我可以正常执行所有操作。随后每次打开表单时，过程重复，不同之处在于尽管 TinyMCE 应用于文本区域，但我无法再其中输入内容。
这是在链接点击时触发的方法：
$('<div id="perspDlg">').dialog({
title:'My Dialog',
width:900,
height:575,
modal:true,
create: function(){
$('span.ui-icon-closethick').html("");
},
close:function(){
$('form#myForm').unbind('submit');
$('textarea[name="discussion"]').tinymce().destroy();
$(this).html('').dialog('destroy');
setTimeout("$('#perspDlg').remove();",100);
},
open:function(){
var dlg = $(this);
$.ajax({
url:_cfcPath+'/lessons/myTemplate.cfm',
dataType:'script',
data:{id:id},
success:function(d,r,o){
dlg.html(d);
$('form#myForm').bind('submit',formHandler);
}
});
},
buttons:[
{text:'Save Form',
click:function(){
$('form#myForm').submit();
//$(this).dialog('close');
}},
{text:'Cancel',
click:function(){
$(this).dialog('close');
}}
]
});
当模板加载时，最后几行会将TinyMCE应用于加载的表单中的文本区域：
$('textarea.tinyMCE').tinymce({
script_url : '/assets/scripts/_lib/tiny_mce/tiny_mce.js',
mode : "textareas",
editor_deselector : "mceNoEditor",
theme : "advanced",
plugins : pluginVal,
//Paste options
extended_valid_elements : "a[name|href|target|rel|title|style|class],div[align|class|style|height|width],form[accept|accept-charset|action|class|dir<ltr?rtl|enctype|id|lang|method<get?post|name|onclick|ondblclick|onkeydown|onkeypress|onkeyup|onmousedown|onmousemove|onmouseout|onmouseover|onmouseup|onreset|onsubmit|style|title|target],hr[class],span[align|class|style],img[class|src|style|alt|title|name],input[accept|accesskey|align<bottom?left?middle?right?top|alt|checked<checked|class|dir<ltr?rtl|disabled<disabled|id|ismap<ismap|lang|maxlength|name|onblur|onclick|ondblclick|onfocus|onkeydown|onkeypress|onkeyup|onmousedown|onmousemove|onmouseout|onmouseover|onmouseup|onselect|readonly<readonly|size|src|style|tabindex|title|type<button?checkbox?file?hidden?image?password?radio?reset?submit?text|usemap|value],table[border|class|style|cellpadding|cellspacing|background|height|width],td[background|style|class|valign|align|height|width],p",
invalid_elements: "font,align,script,applet,iframe",
paste_auto_cleanup_on_paste : true,
paste_remove_styles: true,
paste_remove_styles_if_webkit: true,
paste_strip_class_attributes: true,
paste_retain_style_properties: "none",
paste_block_drop: true,
remove_linebreaks : false,
paste_create_paragraphs : false,
paste_create_linebreaks : false,
relative_urls : false,
remove_script_host : false,
document_base_url : baseURL,
theme_advanced_buttons1 : btn1Val,
theme_advanced_buttons2 : btn2Val,
theme_advanced_buttons3 : btn3Val,
theme_advanced_buttons4 : btn4Val,
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_resizing : true
});
这使用了TinyMCE的JQuery插件，将编辑器加载到所有class为tinyMCE的文本区域中，它可以正常工作。
我在StackOverflow上阅读了几个类似问题的帖子，但没有一个提供了解决此问题的答案。有人有什么想法吗？
一些后续：我进行了一些输出比较，比较了初始对话框打开和后续打开之间的差异，并注意到了一些情况。在初始加载和TinyMCE应用于文本区域时，我看到应用程序创建了一个iframe，加载了一个包含菜单行和一个包含其他iframe的行的表格。该iframe的内容（首次加载）如下：
<tr class="mceLast">
<td class="mceIframeContainer mceFirst mceLast">
<iframe id="mce_0_ifr" frameborder="0" src="javascript:""" allowtransparency="true" title="Rich Text AreaPress ALT-F10 for toolbar. Press ALT-0 for help" style="width: 100%; height: 204px; display: block;">
<html>
<head xmlns="http://www.w3.org/1999/xhtml">
<base href="http://dev.nsite.loc">
<meta content="IE=7" http-equiv="X-UA-Compatible">
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<link href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/themes/advanced/skins/default/content.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" data-mce-href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/plugins/spellchecker/css/content.css?110120111025" href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/plugins/spellchecker/css/content.css?110120111025">
<link rel="stylesheet" data-mce-href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/plugins/class_U/css/content.css?110120111025" href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/plugins/class_U/css/content.css?110120111025">
<link rel="stylesheet" data-mce-href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/plugins/noneprovided/css/content.css?110120111025" href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/plugins/noneprovided/css/content.css?110120111025">
<link rel="stylesheet" data-mce-href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/themes/advanced/skins/default/content.css?110120111025" href="http://dev.nsite.loc/assets/scripts/_lib/tiny_mce/themes/advanced/skins/default/content.css?110120111025">
</head>
<body id="tinymce" class="mceContentBody " contenteditable="true" dir="ltr">
<br data-mce-bogus="1">
</body>
</html>
</iframe>
</td>
</tr>
但是，在后续的加载中，我得到了菜单，但是内部IFrame看起来像这样：
<tr class="mceLast">
<td class="mceIframeContainer mceFirst mceLast">
<iframe id="mce_12_ifr" frameborder="0" src="javascript:""" allowtransparency="true" title="Rich Text AreaPress ALT-F10 for toolbar. Press ALT-0 for help" style="width: 100%; height: 204px; display: block;">
<html>
<head>
</head>
<body>
</body>
</html>
</iframe>
</td>
</tr>
可能是什么原因导致这种情况发生？
更新2: 根据帕特里夏的建议，我将对话框的关闭事件更改为以下内容：
close:function(){
$('form#perspectiveForm').unbind('submit');
var id = $('textarea:tinymce').attr('id');
tinyMCE.execCommand('mceRemoveControl', false, id);
$('textarea#'+id).remove();
$(this).empty().dialog('destroy');
setTimeout("$('#perspDlg').remove();",100);
},
通过一些步骤的调试和 FireBug，我确认了编辑器已被销毁，然后文本区域被完全删除，在销毁对话框并移除 div 前。即便如此，在重新初始化对话框后，我仍然无法在新的 TinyMCE 实例中键入内容，底层代码显示为上次更新的内容。它似乎与之前元素的不正确销毁无关。
更新：Patricia 的最后建议是将加载表单到对话框的 ajax 调用移到.load() 方法中，然后创建对话框。我尝试了这个方法，事情很快就变得糟糕了。远程内容包含必须执行的脚本，因此在 .ajax() 方法上使用 script 数据类型。.load() 方法没有这个选项，而且它非常不喜欢这样做。所以现在我不知道该尝试什么了。