javascript - 调用 Ext.menu.Menu 实例时获取 ExtJS Selection 对象

标签 javascript dom extjs selection

我目前在调用 Ext.menu.Menu 实例时尝试从 DOM 获取当前选定的文本时遇到问题。这里有一个简化的例子。

  1. 从包含以下 EXTJ 示例的标准 HTML 页面中选择并突出显示文本
  2. 右键单击以调用内容菜单
  3. 可从绑定(bind)到上下文菜单的事件监听器中进行选择,但在从上下文菜单中输入或选择选项时不可用。

注意:由于控制台对象,示例目前可以在 Chrome 和 Firefox 中运行

Ext.onReady(function() {
    // Context Menu
    var menu = Ext.create('Ext.menu.Menu', {
    items : [{
        text : 'Copy',
        handler : function() {
        // Selection is not available here
        console.log("On Context menu item:" + window.getSelection().toString());

        }
    }],
    listeners : {
        mouseenter : function() {
        // Selection is not available here
        console.log("Enter menu render: " + window.getSelection().toString());
        },
        activate : function () {
        // Selection is still available
        console.log("Activate Context menu render:" + window.getSelection().toString());
        }
    }
    });

    // Bind to contextmenu event listener 
    Ext.getDoc().on('contextmenu', function(ev) {
    menu.showAt(ev.getXY());
    ev.stopEvent();
    // Selection is available
    console.log("On Context menu :" + window.getSelection().toString());
    });
});

最佳答案

单击上下文菜单时选择不可用,因为右键单击后,选择被清除。当您左键单击菜单项时,没有任何内容被选中。看看这个 fiddle .您可以看到右键单击后立即清除了选择。

您可能需要更花哨并执行保存/恢复之类的操作,如 this answer 中所建议的那样.

参见 this fiddle有关解决方案的示例。

关于javascript - 调用 Ext.menu.Menu 实例时获取 ExtJS Selection 对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12580135/

相关文章:

javascript - 网页的日期选择器仅允许单击特定日期

javascript - 如何从具有相同名称的元素组中获取选定的值?

javascript - 使用原型(prototype)从构造函数引用变量

javascript - 在 DOM 上移动输入时将光标保持在 html 输入中

javascript - 存储 HTML 元素时的内存效率

javascript - ExtJS 4 设置视口(viewport)的加载蒙版

javascript - Ext JS - 如何从 View 中将参数传递给 Controller ​​中存在的监听器

javascript - 悬停时更改 div 内的图像 "src"

java - JSoup 检查 <HTML>、<HEAD> 和 <BODY> 标签是否存在

javascript - ExtJS无法正确显示Ext.panel.Panel的html