tinyMce addContent 不起作用

Question

我有以下代码。 setContent 部分不起作用。如果我查看源代码，我可以看到来自 $rowpost["blog"] 的信息被放入页面中，只是由于某种原因没有显示。

<textarea name="txtBlog" id="txtBlog" cols="50" rows="10"></textarea>
<script type="text/javascript" src="https://cloud.tinymce.com/stable/tinymce.min.js?apiKey=3x7na4p57b2ukuixfz5ird4sgs0kqhpfwzxlg0vz0j4dv4bd"></script>
<script>
    tinymce.init({
        selector:'textarea',
        menubar:false,
        plugins:[
            'advlist autolink link lists image charmap print preview anchor textcolor',
            'searchreplace visualblocks code fullscreen',
            'insertdatetime media table contextmenu paste code help'
        ],
        toolbar:'styleselect | undo redo | bold italic backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help'
    })
    tinymce.get("txtBlog").setContent('<?php echo $rowpost["blog"]; ?>');
</script>

感谢任何想法或建议。

谢谢

编辑

我将代码更改为此，但是当我刷新页面时，它将 textarea 更改回常规 textarea。但是，它会显示来自数据库的信息。

<textarea name="txtBlog" id="txtBlog" cols="50" rows="10"></textarea>
<script type="text/javascript" src="https://cloud.tinymce.com/stable/tinymce.min.js?apiKey=3x7na4p57b2ukuixfz5ird4sgs0kqhpfwzxlg0vz0j4dv4bd"></script>
<script>
    tinymce.init({
        selector:'textarea',
        menubar:false,
        plugins:[
            'advlist autolink link lists image charmap print preview anchor textcolor',
            'searchreplace visualblocks code fullscreen',
            'insertdatetime media table contextmenu paste code help'
        ],
        toolbar:'styleselect | undo redo | bold italic backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help'
        setup: function (editor) {
            editor.on('init', function () {
                this.setContent("<?php echo $rowpost["blog"]; ?>");
            });
        }
    })
</script>

Answer 1

如果您想在页面加载时将内容加载到 TinyMCE，您可以使用 setContent 函数来执行此操作……但您需要确保在尝试使用 setContent() 之前初始化 TinyMCE。在您的示例中，您调用init，然后立即调用setContent()，而不检查编辑器是否已加载。

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

tinymce.init({
  ...
  setup: function (editor) {
    editor.on('init', function () {
        this.setContent("<p>My new content</p>");
    });
  }
  ... 
});

在编辑器完成初始化之前不会调用init 函数，因此您可以确定在调用setContent() 代码之前一切都准备就绪。

注意：使用 init 可确保您可以通过 this 定位特定的 TinyMCE 实例。如果您在页面上有多个编辑器。使用这种方法你不需要使用get() API。