需要帮助了解如何在 TinyMCE 中使用 setContent() 函数

Question

我正在使用 LocalStorage 将文本从第 1 页传递到第 2 页。 Page2 textarea 使用 TinyMCE 编辑器。我在 Tiny 网站上找到了这个功能，我认为它就是为此目的而设计的。但是我是 Javascript 的新手，无法正常工作。有什么帮助吗？

TinyMCE page and function:

我的Html：

<div class=" form-group">
        <div class="col-sm-2 col-md-2"><label for="work">Scope of Work:</label></div>
        <div class="col-sm-10 col-md-10"><textarea id="wo_scope" class="form-control tinymce " rows="5" placeholder="Required / Maximum 500 characters" name="work" cols="50"></textarea></div>
    </div>

Answer 1

如果您想在页面加载时将内容加载到 TinyMCE 中，您可以使用 setContent 函数来实现...但是您需要确保在尝试使用 setContent.

最好的方法是将用于加载内容的代码放入 TinyMCE 的配置对象中。例如：

tinymce.init({
  ...
  setup: function (editor) {
    editor.on('init', function () {
        var dataFromLS = <code to get the HTML from local storage>;
        this.setContent(dataFromLS);
    });
  }
  ... 
});

使用setContent()的基本方法就是将HTML作为方法的唯一参数传递给它。如果您在本地存储中有数据，只需先将其放入 JS 变量中，然后执行以下操作：

var dataFromLS = <code to get the HTML from local storage>;
tinymce.get('wo_scope').setContent(dataFromLS);

请注意，在我上面提供的初始化示例中，您可以将编辑器实例引用为 this。你也可以根据你用TinyMCE替换的<textarea>的ID来获取。一个更完整（正确）的例子可以做这样的事情：

tinymce.get('wo_scope').setContent(datafromLS);

setContent() 方法适用于 TinyMCE 的特定实例，因此您需要先拥有一个才能调用 setContent()。我上面的示例显示了两种获取实例 get() 和在初始化中使用 this.

的方法

注意：在您上面的一条评论中，您使用了 tinymce.activeEditor - 仅当您单击进入 TinyMCE 编辑器实例时才有效 - 这使其成为 "active" 编辑器。如果您在页面加载时执行此操作，您几乎可以肯定还没有活动的编辑器。

需要帮助了解如何在 TinyMCE 中使用 setContent() 函数

Need help understanding how to use setContent() function in TinyMCE

html

javascript

jquery

tinymce