将文本添加到 Froala 文本编辑器答案

【问题标题】：Add text to Froala text editor将文本添加到 Froala 文本编辑器
【发布时间】：2020-06-26 23:26:02
【问题描述】：

我正在尝试以编程方式将 html 输入到 Froala 文本编辑器中。根据他们的文档，这应该可以工作：

$(function(){
    $('#editor').editable("setHTML", "<p>My custom paragraph.</p>", false);
});

但是当我重新加载页面时，我只得到空白空间，没有错误。这绑定到 id #editor 的 textarea。如果我使用此代码：

$(function(){
    $('#editor').editable({inlineMode : false});
});

...然后一切正常。

有谁知道如何以编程方式将 html 输入到这个编辑器中。

【问题讨论】：

你找到解决办法了吗？

标签： javascript jquery froala

【解决方案1】：

你应该试试这个：

$('#editor').froalaEditor('html.set', 'My custom paragraph.');

在此参考中查看有关froala 方法的详细信息： https://www.froala.com/wysiwyg-editor/docs/methods#html.set

【讨论】：

你好，我已经做到了。在编辑表单时，当我提交表单时，该字段没有发布数据。将如何发布此字段？谢谢
这对我有用。就像... var notification_html = $(this).data('html'); $("textarea#feditor").froalaEditor('html.set', notification_html);
最后的方法是什么？

【解决方案2】：

对于您正在寻找 v3 答案的用户，您可以通过以下方式在 v3 中添加文本：

var editor = new FroalaEditor('.selector', {}, function () {
  // Call the method inside the initialized event.
  editor.html.insert('<p>My custom paragraph.</p>');
})

另外，如果你想替换整个内容，那么你可以使用 set 方法

var editor = new FroalaEditor('.selector', {}, function () {
  // Call the method inside the initialized event.
  editor.html.set('<p>My custom paragraph.</p>');
})

【讨论】：

【解决方案3】：

两者都用。首先你必须创建编辑器，然后你可以设置 HTML

$(function(){
    $('#editor').editable({inlineMode : false});
    $('#editor').editable("setHTML", "<p>My custom paragraph.</p>", false);
});

【讨论】：

【解决方案4】：

使用最新版本的 Froala 可以正常工作

$("#froalaEditor")[0]["data-froala.editor"].html.set('This should work fine');

【讨论】：

【解决方案5】：

要附加文本，请使用html.insert

$("#editor").froalaEditor('html.insert','<p>new text to append</p>');

【讨论】：

【解决方案6】：

插入 HTML 后使用“同步”

$("#editor").editable("insertHTML", "123456", true);
$("#editor").editable("sync");

【讨论】：

【解决方案7】：

仅供参考。在 HTML 中

<div id="froala-editor">
  <p>something</p>
</div>

在javascript中

  $(function() {
    $('div#froala-editor').froalaEditor({
      pastePlain: true
    })
  });

【讨论】：

【解决方案8】：

试试这个：

$('#editor').froalaEditor('html.set', 'My custom paragraph.');
$('#editor').froalaEditor('undo.saveStep', 'My custom paragraph.');

参考：https://github.com/froala/wysiwyg-editor/issues/1578

【讨论】：