在wordpress wp_editor中设置TinyMCE 4内容

时间:2016-01-05 07:00:21

标签: javascript jquery wordpress tinymce tinymce-4

我目前正在编写wordpress中的前端编辑。结果应该是使用wordpress帖子进行类似evernote的编辑。

一个主要问题是结合编辑器的必要动态(转换为DOM(已解决)和Get(已解决)以及设置内容)。

Wordpress数据库存储没有段落的标记,并在交付时添加它们。当你最初在php中设置tinymce内容时

wp_editor( $content, $editor_id,$settings );

内容在textarea中写入(没有段落),tinymce在init上删除它并在init上执行一些PROCESSING并将其写入可视化编辑器。

要设置我从wordpress数据库中动态获取的内容,请使用

tinyMCE.get(editor_id).setContent(content);

但遗憾的是,这似乎绕过了对tinymce init进行的处理,导致断行和段落丢失。

我目前的解决方法是将内容设置为wordpress到worpress文本编辑器,然后切换回可视编辑器,因为这似乎触发了break和段落的处理:

jQuery( "#myeditor-html" ).trigger( "click" );
jQuery('#textarea_id').val(content);
jQuery( "#myeditor-tmce" ).trigger( "click" );

我真的不喜欢这个解决方案,因为

  • 如果您喜欢视觉内容,Wordpress不建议切换
  • 我想稍后在
  • 上禁用'quicktags'文本编辑器

我的编码技巧不足以阅读tinymce的初始化代码,我也无法找到wordpress在jQuery( "#myeditor-tmce" ).trigger( "click" )上的作用。

有人有同样的问题:

tinymce setContent removes new lines

但是这个解决方案是如此基本,以至于它与任何扩展标记(例如列表)崩溃。

你能帮我找到一个优雅的代码来填充wp数据库内容,这意味着找出上面提到的PROCESSING吗?

1 个答案:

答案 0 :(得分:0)

您是否尝试在php后端使用wpautop,然后尝试根据这些值设置内容?

可能会删除/删除换行符:

\n(Linux),\r(Mac),\r\n(Windows)等。

https://codex.wordpress.org/Function_Reference/wpautop