追加東西到選定的文本與jQuery

我試圖追加一個<a>標籤進入選定的文本，當用戶右鍵單擊it.i搜索堆棧，沒有找到匹配。追加東西到選定的文本與jQuery

2012-02-15 bizzr3

可靠地處理選定的文本是一個棘手的跨瀏覽器。 Tim Down的圖書館Rangy可以在那裏很有用，他對許多瀏覽器的特質進行了平滑處理。（即使您不想使用該庫，也可以學習該技術。）

其中一個core Rangy demos是使用the RangyRange#surroundContents method圍繞具有元素的選定文本。對於在演示的代碼看起來是這樣的：

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。

來源

2012-02-15 08:48:25

+1真棒的東西！ – gideon 2012-02-15 08:58:01

幹得不錯，但有沒有解決方案可以做到這一點沒有插件？ – bizzr3 2012-02-15 10:01:12

@bizzare：正如我上面所說的，如果你不想按原樣使用Rangy，你仍然可以研究Rangy如何使用這些技術。看看'getSelection'和'surroundContents'是如何工作的。這是Tim做出[Rangy開源]（http://code.google.com/p/rangy/source/browse/trunk/src/#src%2Fjs%2Fcore）的快樂，而不是混淆它。 – 2012-02-15 10:08:57

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-15 08:50:45 gideon

該操作說**選擇**文本（在問題和標籤） – 2012-02-15 08:51:12

哦，他的意思是獲得選定的文本右鍵點擊，哦，男孩，我很抱歉掃描太快的問題太快。 – gideon 2012-02-15 08:53:35

是的，我希望你的代碼在div的末尾添加一個鏈接 – bizzr3 2012-02-15 08:54:23

追加東西到選定的文本與jQuery

回答

相關問題