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

Question

嗨,我想有能力显示自定义菜单(或上下文菜单),当用户选择一些文字与媒体提供的相似.

如何实现这样的事情？我知道native/jquery上下文菜单插件,但我怎么知道用户何时选择文本？浏览器的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);
        }
    });
});

只需使弹出/工具栏可见,而不是警报.希望这可以帮助!

编辑 我改变了演示,以显示一种可能的方式来显示弹出菜单/工具栏.