0

我正在尝试找到一种方法，当用户使用 Sencha 的 EXT GWT 2.x 激活上下文菜单（右键单击菜单）时，突出显示选定的文本（尽管如果有 3.x 解决方案我可以）。

用例：

  1. 用户正在查看屏幕上的内容。
  2. 用户选择一些文本块（例如短语）。
  3. 用户右键单击以查看上下文菜单，以便他们可以对所选文本执行操作并查看上下文菜单。出现菜单时，所选文本保持选中状态。

在测试中，GXT 上下文菜单似乎会在菜单出现时自动取消选择文本。有没有办法防止这种情况并对所选文本采取行动？

到目前为止，我已经尝试过：

一种。为 Context Menu 事件 ( Events.OnContextMenu) 添加一个侦听器，以查看是否有我可以更改的属性（ contextMenu.disableTextSelection(false)即使它已经在构建视图时设置）。

湾。通过向同一个侦听器 ( ) 添加一个本地方法来覆盖由上下文菜单的外观创建的取消选择效果Events.OnContextMenu，然后该侦听器使用 JS 尝试获取当前选定的文本，将其复制到临时变量，然后立即添加它返回页面上的范围（有效地重新选择已选择的文本），但这也不起作用。我能够确认本机方法已触发，检测到文本并似乎将其放回范围内，但似乎可能触发了另一个事件或发生了其他一些操作，这些操作仍会在菜单出现之前清除选择。

任何想法将不胜感激。

4

1 回答 1

0

我仍然不知道官方解决方案，我开始认为这是 GXT 2.x 中的一个错误，但我能够想出一个解决方法并将其发布在这里，以防其他人遇到类似的问题.

对于初学者来说，这个问题似乎出现在 Firefox 而不是 IE 中。对于 Firefox，以下工作（摘要后的示例代码片段）：

  1. Events.OnContextMenu为组件/容器/面板/等上 的事件添加监听器。
    • 重写该handleEvent方法并添加一个原生方法以使用 JS 来检测用户是否在屏幕上选择了文本。如果选择了文本，请将其保存到 JavaScriptObject（GWT 提供的 JS 对象的不透明包装，请参阅 GWT 文档了解详细信息）。
  2. Events.Show为上下文菜单对象上 的事件添加一个侦听器。
    • 覆盖该handleEvent方法，添加一个native方法使用JS重新选择之前的选择。
  3. Events.Hide为上下文菜单对象上 的事件添加一个侦听器。
    • 覆盖 handleEvent 方法并清除我们的选择变量，然后运行本机方法以清除任何剩余的选择（如果需要）。

使用这些步骤，我能够在 Firefox 中显示上下文菜单时保持选中的文本。

示例代码
（这些只是示例代码块，以帮助更好地说明这些步骤 - 此代码的复制/粘贴不会为您提供所需的一切）

public class ContextMenuExample {

    JavaScriptObject selection;
    Menu contextMenu = new Menu();

  public void buildPanelExample() {

    ContentPanel panel = new ContentPanel();  
    panel.addListener(Events.onContextMenu, new Listener<BaseEvent>() {
      if (!GXT.isIE) {
        selection = findSelectedTextOnScreen();
      }
    });

    contextMenu.addListener(Events.Show, new Listener<BaseEvent>() {
      if (!GXT.isIE) {
        reSelectText(selection);
      }
    });

    contextMenu.addListener(Events.Hide, new Listener<BaseEvent>() {
      if (!GXT.isIE) {
        clearSelection();
      }
    });

    private native JavaScriptObject findSelectedTextOnScreen() /*-{
      // use JS method to get selected text as a range
      return selectedText;
    }-*/;

    private native void reSelectedText(JavaScriptObject range) /*-{
      // use JS method to find a range a select it
    }-*/;

    private native void clearSelection() /*-{ 
      // us JS to clear any selected ranges 
    }-*/;

    private void clearSelections() {
      selection = null;
      clearSelection();
    }

  }
}
于 2012-08-31T17:15:15.173 回答