1

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

4

2 回答 2

5

可靠地处理选定的文本是一个有点棘手的跨浏览器。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);
            }
        }
    }
}

你会做同样的事情，但是使用 aa而不是 a span。

于 2012-02-15T08:48:25.220 回答
0

EDIT注意到您谈论选定的文本有点太晚了。

也许您可以检查document.elementFromPoint，我认为仅在 FireFox 中支持。

您是否正在寻找这样的东西：

html:

<div id="rightclick">
Right Click me:   
</div>​

Javascript：

$("#rightclick").mousedown(function(e) {
    if (e.which === 3) {
        $(this).append("<a href='http://www.google.com'>Link</a>");
    }
});
​

查看演示：http: //jsfiddle.net/BgW7x/2/

于 2012-02-15T08:50:45.347 回答