Question

这是我已经问过的这个问题的后续问题：Add a tinymce editor dynamically

我有一个包含编辑器的页面（tinyMCE）。我动态添加textarea（添加条目按钮）。它工作正常，期望它撤消我对其他TinyMCE所做的所有改变。如果我加载一个带有一个显示“Something 40”的tinyMCE的页面，我输入“Something 40 and some stuff”，然后我点击添加一个条目，出现一个新的tinymce，但第一个现在显示“Something 40”。

我使用以下代码：

<script type="text/javascript">
//<![CDATA[
tinyMCE.init({"selector":"textarea.tinymce","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","theme_advanced_buttons3_add":"tablecontrols,fullscreen","toolbar":"insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image","plugins":"paste,table,fullscreen,image,code,link","dialog_type":"modal","content_css":"/assets/application.css"});
//]]>
</script>
<script>
function loadTinyMCEEditor() {
tinyMCE.init({"selector":"textarea.tinymce","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","theme_advanced_buttons3_add":"tablecontrols,fullscreen","toolbar":"insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image","plugins":"paste,table,fullscreen,image,code,link","dialog_type":"modal","content_css":"/assets/application.css"});
}
</script>

两者都是添加微小MCE的相同选项，第一个是我希望在页面显示时显示为编辑器的textarea，第二个是在我动态添加textarea时调用的函数。

以下是我如何将tinyMCE添加到nex textarea：

$(document).on 'nested:fieldAdded', (event) ->
  loadTinyMCEEditor()
  #alert "azeaze"+event.field.attr("id")
  #alert "totoooot "+event.field.find('textarea').attr("id")
  tinyMCE.execCommand "mceAddControl", true, event.field.find('textarea').attr("id")

如何在不删除其他TinyMCE字段更改的情况下添加tinyMCE？

Answer 1

您可以使用：

tinymce.EditorManager.execCommand('mceAddEditor', true, "here_place_editor_class or ID");

如果您想使用ID并且每个编辑器实例都是唯一的，您还需要动态生成此选择ID。

当您的页面上已经存在tinymce实例时，动态添加一个tinymce编辑器

1 个答案: