在容器中渲染 tinymce 4 display:none

Question

我想在包含在掩码 div 中的文本区域上渲染 tinymce4 但我有这个错误：

FontFamily is undefined

我的渲染脚本是：

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

当您单击 "render" 按钮时，您可以看到此 fiddle 中的错误： http://fiddle.tinymce.com/uLfaab

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

有没有办法解决这个问题？

谢谢

Answer 1

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

如果您查看页面的源代码（使用浏览器工具），您会发现 TinyMCE 确实 "running" 但不可见。

如果您希望 <textarea> 最初是不可见的，然后在单击按钮时变得可见，您可以通过按钮后面的函数中的 JavaScript 来实现。

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

有两个变化...

1 - 在包含的 <div> 上放置一个 ID，以便您可以通过 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';
}

在容器中渲染 tinymce 4 display:none

Render tinymce 4 in a container display:none

javascript

tinymce

tinymce-4