GWT-RichTextArea-格式化程序火灾

GWT-RichTextArea-格式化程序火灾,gwt,Gwt,我的RichTextArea格式化程序设置如下 void initUI(){//invoke in default constructor... getRichTextArea().getFormatter().setFontName("Verdana"); getRichTextArea().getFormatter().setFontSize(FontSize.X_SMALL); getRichTextArea().ge

我的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();
的方法也可以删除格式化程序设置:(

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

谢谢


p.S.GWT 2.3

您需要了解“格式”是什么。富文本意味着它包含多个段落,每个段落都有自己的样式和属性。因此没有“默认”段落。您必须定义一个

实际上,在富文本区域下,它只是一个contenteditable=true的div。如果将其放入一个样式化容器(另一个div),它将继承其中的样式。这样,您可以定义一些默认样式

另一种方法是确保您想要什么属性,并直接用Formatter指定它

我看没有其他方法可以实现这一点。格式化程序只是execCommand的包装器,其行为依赖于浏览器。让我们做一些分析

这是您的富文本区

<div contenteditable=true>hello, world!</div>
如果您使用
setText(“”)
,而实际上使用的是
div.innerText='
,您将得到

<div contenteditable=true></div>

你的格式丢失了


您只能通过将样式放入容器并在容器上设置样式,或者记住使用的格式并在setText()之后重新应用样式来维护样式。

似乎需要RichTextArea中的光标控件来定位光标、选择范围并删除文本

此功能在gwt RichTextArea中不存在,但有一个有着长期讨论的问题、一些修补程序和一个实现它的问题。该问题最近已经解决,因为gwt维护人员正在解决所有没有最近活动的问题,但也许您可以重新打开它或ping所有者来完成。使用此库,您可以uld获取文档的一部分并将其删除,而不删除格式标签

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

通过使内容正文具有样式,很容易:

import static com.google.gwt.query.client.GQuery.*;
[...]
//首先将小部件附加到DOM
RootPanel.get().add(richTextArea);
//我们只能在创建iframe文档后操作主体,
//这是在它被连接之后发生的。
//因为richtTextArea使用超时来初始化,所以我们需要一个延迟。
$(richTextArea)
.延迟(1,
懒惰的
.contents().find(“正文”)
.css(“字体名称”、“verdana”)
.css(“字体大小”、“x小”)
.css(“颜色”、“灰色”)
.done());
如果要在不导入gwtquery的情况下执行相同的操作,则需要一些jsni,以便在附加和初始化RichTextArea后获取body元素:

//首先将小部件附加到DOM
RootPanel.get().add(richTextArea);
//我们只能在创建iframe文档后操作主体,
//这是在它被连接之后发生的。
//使用计时器,因为richtTextArea使用超时来初始化
新计时器(){
//没有获取主体的方法,因此我们使用JSNI
私有本机元素getBodyElement(元素iframe)/*-{
返回iframe.contentWindow.document.body;
}-*/;
公开募捐{
元素e=getBodyElement(richTextArea.getElement());
e、 getStyle().setProperty(“fontName”、“Verdana”);
e、 getStyle().setProperty(“fontSize”、“x-small”);
e、 getStyle().setProperty(“颜色”、“灰色”);
}
}.附表(1);

不,我已经格式化了我的富文本区域。问题是如何从文本中清除它,而不是删除格式?正如我所说,如果使用像setText(“”)等这样的代码,它会删除文本,也会删除格式化程序设置:(这就是问题所在……我编辑了我的问题(添加了代码片段)请注意我的意思是复合构造函数加载的富格文本区域有一个格式化程序,它有设置(正如我的代码片段所说);因此,例如,我尝试通过调用getRichTextArea()之类的代码来重置它的所有文本。setText(“”);文本消失,但正如我所看到的,所有文本区域样式(格式化)我也很遗憾:那我该如何修复它?你认为有什么方法可以用纯GWT修复它?我想我已经说得很清楚了:“你只能通过将样式放入容器并在容器上设置样式,或者记住所使用的格式并在setText()后重新应用它来维护样式。”编辑了我的答案,添加了如何使用gwt+JSNI更改主体样式。这很有趣;谢谢。因此,您提出将样式作为一个元素直接设置到富文本区域中……但在这种情况下,您建议如何清除它,比如说单击按钮?我的意思是重置其所有内部文本?它是否也在JSNI区域中,或者可以使用setText(“))?您认为呢?我想说的是,通常在向UI添加RichTextArea时,开发人员希望设置一些默认样式。您可以修改文档,添加环绕光标的标记,也可以修改整个正文。您的解决方案是第一种情况,因此当您使用setText(“”)时,您可以删除这些标记。我的解决方案是设置正文的样式,因此setText(“”)将保留样式。好的,我知道了。但我一直在想……有没有一种方法可以提取纯gwt上的富格文本区域正文?您怎么看?没有,没有方法可以获取gwt核心中的body元素。
<div contenteditable=true></div>