如何在谷歌闭包编辑器中创建一个样式选择器

时间:2013-05-16 18:14:35

标签: javascript html editor google-closure google-closure-library

我想知道在goog闭包编辑器中创建一个工作“样式选择器”选择器是多么困难,类似于tinymce中的那个。

我指的是文本样式的选择器,例如

heading 1
heading 2
heading 3
paragraph

从文档中我认为默认情况下没有,即使有一些稍微相关的默认按钮,例如bold等。我知道的预先存在的按钮的逻辑在一个名为的插件中提供basictextformatter.js

我熟悉编写插件,我会使用.execCommandInternal函数实现此功能,并使用ToolbarFactory创建selectButton

但我的问题是,我是否真的必须从头开始编写所有逻辑,例如:如果选择是插入符号,则在样式选择中包含多少文本,并在应用新选择时删除先前的样式,处理交叉-browser标记insonsistencies,在按钮中显示所选的样式以及所有这些?

由于它似乎是许多其他编辑器的标准功能,我是否有机会错过预先存在的插件功能或其他构建块? 如果没有重新发明轮子的任何暗示,我将不胜感激。

2 个答案:

答案 0 :(得分:0)

听起来你指的是“插件”,这些是你可以注入Google Closure的goog.editor.Field文本编辑器的对象。 Google Closure Library中包含许多标准插件(粗体,斜体,下划线,链接等),尽管您可以随时自行推出。例如,我必须制作自己的粘贴插件,从粘贴的文本中删除HTML格式。

在您挑选出所需的插件后,您可以在编辑器的工具栏中添加按钮,这些按钮会触发那些注入插件的命令事件。

这是一篇博文,比以往任何时候都更好地解释了如何实际设置它: http://closuretools.blogspot.com/2010/07/introducing-closure-library-editor.html

答案 1 :(得分:0)

我认为我找到了答案。

有一个名为HeaderFormatter的lib的插件。不幸的是,它依赖于BasicFormatter插件,并且似乎没有默认按钮(你必须创建自己的) - 但看起来就像是这个问题的答案。