Question

我正在尝试使用HTML文本创建一个区域，在GWT或SmartGWT中创建等效的DIV。

最初会显示一些纯文本。用户可以突出显示文本，只需按一下按钮，文本就会有一条直线，并且会变成红色。此外，用户可以单击文本中的任意位置并键入新文本，该文本将显示带下划线和绿色。

我需要为每个修改以及新键入的文本等获取插入位置。

GWT或SmartGWT中是否有可以为我提供此类功能的小部件？目前我有一个使用DIV的所有JavaScript解决方案并在点击时插入SPAN，但我想远离它。

Answer 1

这是RichTextArea和RichTextToolbar小部件的演示：

http://samples.gwtproject.org/samples/Showcase/Showcase.html#!CwRichText

RichTextArea公开了一个可以完成你需要的事情的格式化程序。因此，如果您已经有按钮，则可以在单击每个按钮时使用格式化程序来完成工作。

更新：

例如，如果您想要删除所选文本或更改其颜色，可以非常轻松地完成：

formatter.toggleStrikethrough();
formatter.setForeColor("#F00");

如果您需要获取所选文本，可以使用以下内容：

private static native String getSelection(Element elem) /*-{
    var txt = "";
    var range;
    var parentElement;
    var container;

if (elem.contentWindow.getSelection) {
        txt = elem.contentWindow.getSelection();
} else if (elem.contentWindow.document.getSelection) {
        txt = elem.contentWindow.document.getSelection();
} else if (elem.contentWindow.document.selection) {
        range = elem.contentWindow.document.selection.createRange();
        txt = range.text;
}
return "" + txt;
}-*/;

Answer 2

也许你已经看过，但SmarGWT也有RichTextEditor。 http://www.smartclient.com/smartgwt/showcase/#form_controls_richedit

中有一个演示

我从未使用它，但有一些与字体相关的功能。

返回的编辑器区域是Canvas，但您可以使用“插入位置”支持设置自己的组件。

修改GWT或smartGWT小部件或区域中的富文本

2 个答案: