Question

Google Closure Library编辑器：demo，documentation。

可编辑区域是iframe。如何设置可编辑区域的默认字体？现在它是浏览器的默认字体。我不想在可编辑区域**的内容周围放置字体标记。这样，我可以在将来更改我的网站字体，而无需修改编辑器中编写的每个HTML内容。

**我的意思是这样的：

<font size="2" face="georgia, serif"><b>content</b></font>

我更喜欢这个：

<b>content</b>

...然后使用CSS为佐治亚字体设置编辑器的可编辑区域。这样，我的数据库中的HTML内容（由编辑器生成）将不包含硬编码字体，因此我可以在将来更改字体。

编辑：也许我应该使用SeamlessField而不是Field作为可编辑区域？

Answer 1

在创建您引用的iFrame的makeEditable()上致电goog.editor.Field后，该字段会触发goog.editor.Field.EventType.LOAD类型的事件。如果您收听该事件，您可以拉出iFrame并将链接元素折腾到CSS样式表中，这样您就可以轻松修改编辑器中的内容。

这相当于我的一位听众应该让你走上正轨。（我没有检查goog.editor.Field是否是事件的目标，但我认为是。）

some.namespace.Page.prototype.onEditorLoad_ = function(event) {
  var editor = /** @type {goog.editor.Field} */ (event.target);
  var iFrame = editor.getEditableIframe();
  if (iFrame) {
    var fieldDomHelper = editor.getEditableDomHelper();
    var documentNode =
      fieldDomHelper.getFrameContentDocument(iFrame).documentElement;

    var head = documentNode.getElementsByTagName(goog.dom.TagName.HEAD)[0];
    if (!head) {
      head = fieldDomHelper.createDom(goog.dom.TagName.HEAD);
      goog.dom.insertChildAt(documentNode, head, 0);
    }

    fieldDomHelper.appendChild(
      head,
      fieldDomHelper.createDom(
        goog.dom.TagName.LINK,
        { 'href': '/css/myCSS.css', 'rel': 'stylesheet', 'type': 'text/css' }
      )
    );
  }
}

最后，在该CSS文件中，您可以添加所需的任何样式。比如你的字体改变。

如何在Google Closure Library富文本编辑器中设置默认字体

1 个答案: