在文本选择上显示自定义菜单

Question

您好我希望能够在用户选择与介质相似的文本时显示自定义菜单（或上下文菜单）。

如何实现这样的事情？我知道native / jquery上下文菜单插件，但我怎么知道用户何时选择文本？ Browser's onselect似乎仅支持输入元素。

Answer 1

以下是.getSelection()的基本聆听者： DEMO

if (!window.x) {
    x = {};
}

x.Selector = {};
x.Selector.getSelected = function() {
    var t = '';
    if (window.getSelection) {
        t = window.getSelection();
    } else if (document.getSelection) {
        t = document.getSelection();
    } else if (document.selection) {
        t = document.selection.createRange().text;
    }
    return t;
}

$(document).ready(function() {
    $(document).bind("mouseup", function() {
        var selectedText = x.Selector.getSelected();
        if(selectedText != ''){
            alert(selectedText);
        }
    });
});

只需让您的弹出窗口/工具栏可见即可取代警报。希望这有帮助！

修改 我更改了演示，以显示一种显示弹出菜单/工具栏的可能方式。