Tinymce:如图所示,在编辑器外部创建自定义工具栏

问题描述

Please click on the link to view the UX I am trying to achieve

关于如何实现上述目标,我需要一些指导。想法是在光标旁边显示加号图标,用户可以轻松地单击它并插入自己选择的项目。我觉得这是一个很棒的用户体验!

我们非常感谢您的帮助!

解决方法

您可以使用.setContent()方法以编程方式向编辑器添加内容: https://www.tiny.cloud/docs/api/tinymce.dom/tinymce.dom.selection/#setcontent https://www.tiny.cloud/docs/api/tinymce/tinymce.editor/#setcontent

这里是Tiny Fiddle演示: http://fiddle.tinymce.com/5vhaab

在那个小提琴中,我还通过将menubartoolbar设置为false来禁用它们。 https://www.tiny.cloud/docs/configure/editor-appearance/#menubar https://www.tiny.cloud/docs/configure/editor-appearance/#toolbar

此外,您可以使用.execCommand()方法以编程方式从编辑器本身之外触发其他编辑器命令: https://www.tiny.cloud/docs/api/tinymce/tinymce.editorcommands/#execcommand

以下是可用命令的列表: https://www.tiny.cloud/docs/advanced/editor-command-identifiers/