javascript - 在容器中渲染tinymce 4显示:none

Question

我想在包含在屏蔽 div 中的文本区域上渲染tinymce4，但出现此错误:

FontFamily is undefined

我的渲染脚本是:

new tinymce.Editor('textarea_id', custom_settings, tinymce.EditorManager).render();

当您单击“渲染”按钮时，您可以在这个 fiddle 中看到错误: http://fiddle.tinymce.com/uLfaab

使用tinymce 3，我可以毫无问题地做到这一点。

有办法解决这个问题吗？

谢谢

Answer 1

如果<textarea>包含 TinyMCE 的内容位于不可见的 <div> 内部那么 TinyMCE 也将不可见。

如果您查看页面的源代码(使用浏览器工具)，您将看到 TinyMCE 确实正在“运行”，但不可见。

如果你想要<textarea>最初是不可见的，然后在单击按钮时变得可见，您可以通过按钮后面的函数中的 JavaScript 来做到这一点。

我已经更新了您的 TMCE Fiddle:http://fiddle.tinymce.com/uLfaab/1

有两个变化...

1 - 在您的容器上添加 ID <div>这样您就可以轻松地通过 JavaScript 定位它:

<form method="post" action="dump.php">
  <div id="tmceDiv" style="display:none;">
    <textarea id="tmce" name="content" class="mceEditorTxtModif"></textarea>
  </div>
</form> 

2 - 使用 JavaScript 制作包含 <div>可见:

function test() {
  new tinymce.Editor("tmce", tmce_settings_bureau, tinymce.EditorManager).render();
  // This next line makes the DIV visible!
  document.getElementById('tmceDiv').style.display = 'block';
}