0

我的 RichTextArea 格式化程序设置为

void initUI(){//invoke in default constructor...
            getRichTextArea().getFormatter().setFontName("Verdana");
            getRichTextArea().getFormatter().setFontSize(FontSize.X_SMALL);
            getRichTextArea().getFormatter().setForeColor("gray");
}

接下来我想知道如何正确清除 RichTextArea 并保留其格式化程序，因为我尝试了类似的代码

getRichTextArea().setText(null);//invoke on some button click...

...它确实删除了所有内部文本，但是当我尝试重新输入文本时，整个格式设置被触发或者因为重新输入的文本具有默认字体和颜色等而不是格式化的:(

...顺便说一下，像getRichTextArea().getFormatter().undo();删除格式化程序设置这样的方法:(

所以我的问题是......如何清除富文本区域并保持其格式？

谢谢

PS GWT 2.3

4

2 回答 2

1

您需要了解“格式”是什么。富文本意味着它包含多个部分，每个部分都有自己的样式和属性。所以没有“默认”的。你必须定义一个。

实际上，在富文本区域下，它只是一个 contenteditable=true 的 div。如果你把它放到一个带样式的容器（另一个 div）中，它将继承其中的样式。这样您就可以定义一些默认样式。

另一种方法是确定您想要的属性并直接使用 Formatter 指定它。

我认为没有其他方法可以实现这一目标。Formatter 只是 execCommand 的包装器，其行为取决于浏览器。让我们做一些分析。

这是您的富文本区域

<div contenteditable=true>hello, world!</div>

如果您选择所有文本并调用Formatter.toggleBold()，您将获得：

<div contenteditable=true><b>hello, world!</b></div>

如果你setText('')真的做到了div.innerText=''，你会得到

<div contenteditable=true></div>

你的格式丢失了。

您只能通过将其放入容器并在容器上设置样式来解决该样式以保持样式，或者记住使用的格式并在 setText() 之后重新应用它。

于 2013-06-10T21:37:50.903 回答
0

您似乎需要 RichTextArea 中的光标控制来定位光标、选择范围和删除文本。

此功能在 gwt RichTextArea 中不存在，但有一个问题已进行了长时间的讨论，一些补丁和一个库（gwt-selection）实现了它。该问题最近已关闭，因为 gwt 维护人员正在摆脱所有最近没有活动的问题，但也许您可以重新打开它或 ping 所有者来执行此操作。使用此库，您可以获得文档的一部分并将其删除，而无需删除格式标签。

无论如何，如果您需要删除完整的文本并为所有内容设置一些默认 css，您可以做的是为 RichTextArea iframe 的主体设置样式。

使用gwtquery获取内容主体的样式很容易：

import static com.google.gwt.query.client.GQuery.*;

[...]

// First attach the widget to the DOM
RootPanel.get().add(richTextArea);

// We only can manipulate the body, once the iframe document has been created, 
// and this happens after it has been attached. 
// Because richtTextArea uses a timeout to initialize we need a delay.
$(richTextArea)
  .delay(1, 
    lazy()
      .contents().find("body")
        .css("font-name", "verdana")
        .css("font-size", "x-small")
        .css("color", "gray")
    .done());

如果你想在不导入 gwtquery 的情况下做同样的事情，你需要一些 jsni 来在 RichTextArea 附加并初始化之后获取 body 元素：

// First attach the widget to the DOM
RootPanel.get().add(richTextArea);

// We only can manipulate the body, once the iframe document has been created, 
// and this happens after it has been attached.
// Using a timer because richtTextArea uses a timeout to initialize
new Timer() {

  // There is no method to get the body, so we use JSNI
  private native Element getBodyElement(Element iframe) /*-{
    return iframe.contentWindow.document.body;
  }-*/;

  public void run() {
    Element e = getBodyElement(richTextArea.getElement());
    e.getStyle().setProperty("fontName", "Verdana");
    e.getStyle().setProperty("fontSize", "x-small");
    e.getStyle().setProperty("color", "gray");
  }
}.schedule(1);
于 2013-06-11T06:30:28.620 回答