Question

我是Javascript / TinyMCE的初学者，我尝试了解如何从编辑器中获取HTML内容，并使用简单的alert（）函数显示它。

我的HTML页面上有这个简约配置：

<div id="tiny">
<script type="text/javascript">
tinyMCE.init({
        // General options
        mode : "specific_textareas",
        editor_selector : "mceEditor"
});
</script>
</div>

<form method="post" action="somepage">
        <textarea id="myarea1" class="mceEditor">This will be an editor.</textarea>
</form>

在TinyMCE Website上，他们解释说我必须使用它：

// Get the HTML contents of the currently active editor
console.debug(tinyMCE.activeEditor.getContent());

还here

tinymce.activeEditor.getContent()

我不知道为什么它不起作用

有人有想法吗？

Answer 1

我不知道为什么它不起作用

这不起作用，因为

console.debug(tinyMCE.activeEditor.getContent());

tinymce.activeEditor.getContent();

这些陈述没有被执行。

尝试遵循此FIDDLE ....

tinyMCE.init({
        // General options
        mode : "specific_textareas",
        editor_selector : "mceEditor"
});

获取内容的功能....

function get_editor_content() {
  // Get the HTML contents of the currently active editor
  console.debug(tinyMCE.activeEditor.getContent());
  //method1 getting the content of the active editor
  alert(tinyMCE.activeEditor.getContent());
  //method2 getting the content by id of a particular textarea
  alert(tinyMCE.get('myarea1').getContent());
}

点击按钮获取编辑器的内容......

<button onclick="get_editor_content()">Get content</button>

Answer 2

也许是这样的？您的变量为tinyMCE，但您在getContent()上呼叫tinymce。 JS区分大小写;）

Answer 3

我正在寻找一个解决方案，并尝试了上面的一些，然后更多地查看tinymce文档，发现这是有效的。
使用微小的mce 4

function getHTML()
{
   tinymce.activeEditor.on('GetContent', function(e) {
     console.log(e.content);
   });
}

只需用onclick调用该函数，看看结果是什么......
我的来源是： http://www.tinymce.com/wiki.php/api4:class.tinymce.ContentEvent

Answer 4

TinyMCE以'#textareaid'+'_ ifr'格式创建iframe所以通过使用jquery我们可以查询你喜欢的文本区域的HTML内容

iframe ID将是您的textarea ID，并附加“_ifr”。因此，您可以从tinyMce

中提取HTML内容

$('#textareaId_ifr').contents().find("html").html();

如何从TinyMCE编辑器中提取HTML内容

4 个答案: