使用jquery在选定文本中附加内容

Question

<a>当用户右键单击它时,我试图将标签附加到选定的文本中.我在堆栈上搜索,没有找到匹配项.

Answer 1

可靠地处理选定的文本是一个有点棘手的跨浏览器.Tim Down的图书馆Rangy在那里非常有用,他对许多浏览器的特性进行了平滑处理.(即使您不想使用该库,也可以根据这些技术进行研究.)

其中一个核心Rangy演示使用该RangyRange#surroundContents方法围绕具有元素的选定文本.演示中的代码如下所示:

function getFirstRange() {
    var sel = rangy.getSelection();
    return sel.rangeCount ? sel.getRangeAt(0) : null;
}
function surroundRange() {
    var range = getFirstRange();
    if (range) {
        var el = document.createElement("span");
        el.style.backgroundColor = "pink";
        try {
            range.surroundContents(el);
        } catch(ex) {
            if ((ex instanceof rangy.RangeException || Object.prototype.toString.call(ex) == "[object RangeException]") && ex.code == 1) {
                alert("Unable to surround range because range partially selects a non-text node. See DOM Level 2 Range spec for more information.\n\n" + ex);
            } else {
                alert("Unexpected errror: " + ex);
            }
        }
    }
}

你会做同样的事情,但用一个a而不是一个span.