如何在点击段落的任何单词时添加工具提示？

Question

function get_selection() 
            {
                var txt = '';
                if (window.getSelection) 
                {
                    txt = window.getSelection();
                } 
                else if (document.getSelection) 
                {
                    txt = document.getSelection();
                } 
                else if (document.selection) 
                {
                    txt = document.selection.createRange().text;
                }
                return txt; 
            }
            $(document).dblclick(function(e) 
            {
                 var t = get_selection();
                 alert(t);
            });

我想在函数中使用jQuery插件for toolbar（toolbar.js），我们获取双击的单词，是否可能？请指导。

Answer 1

您可以采用的一种方法是将所选文本包装在<span/>标记中，以便附加插件。

$(document).dblclick(function() {
    var span = document.createElement('span');
    var sel = document.getSelection();
    if (sel && sel.rangeCount) {
        var range = sel.getRangeAt(0).cloneRange();
        // wrap text in span element
        range.surroundContents(span);
        sel.removeAllRanges();
        sel.addRange(range);
        // show tooltip
        $(span).toolbar({
            content: '#toolbar-options',
            position: 'top'
        // remove span when tooltip hides
        }).on('toolbarHidden', function (e) {
            $(span).contents().unwrap('span');
        });
    }
});

Demo

这应该让您开始，因为您需要进行调整以确定所选文字是否为单词。