在文本選擇之前/之後添加元素

我正在尋找允許我在選定文本之前或之後構建某些元素的函數。類似這樣的一個javascript replace selection all browsers，但用於在選擇之前或之後添加一些內容而不是替換它，如after()和before() jQuery方法。我應該使用一些DOM選擇方法，如果是的話，哪一個？或者確實存在更容易實現的東西？在文本選擇之前/之後添加元素

來源

2011-11-27 optimista

沒有一個答案，但我敢打賭，你可以做到這一點很容易地使用添唐氏[瘦長]（http://code.google.com/p/rangy /）庫。 –

這裏有一對功能來做到這一點。

活生生的例子：http://jsfiddle.net/hjfVw/

代碼：

var insertHtmlBeforeSelection, insertHtmlAfterSelection; 

(function() { 
    function createInserter(isBefore) { 
     return function(html) { 
      var sel, range, node; 
      if (window.getSelection) { 
       // IE9 and non-IE 
       sel = window.getSelection(); 
       if (sel.getRangeAt && sel.rangeCount) { 
        range = window.getSelection().getRangeAt(0); 
        range.collapse(isBefore); 

        // Range.createContextualFragment() would be useful here but is 
        // non-standard and not supported in all browsers (IE9, for one) 
        var el = document.createElement("div"); 
        el.innerHTML = html; 
        var frag = document.createDocumentFragment(), node, lastNode; 
        while ((node = el.firstChild)) { 
         lastNode = frag.appendChild(node); 
        } 
        range.insertNode(frag); 
       } 
      } else if (document.selection && document.selection.createRange) { 
       // IE < 9 
       range = document.selection.createRange(); 
       range.collapse(isBefore); 
       range.pasteHTML(html); 
      } 
     } 
    } 

    insertHtmlBeforeSelection = createInserter(true); 
    insertHtmlAfterSelection = createInserter(false); 
})();

來源

2011-11-27 19:22:42

在MSIE： collapse給定範圍和使用pasteHTML插入元件

其他： 另外collapse給定範圍內，並且經由insertNode

兩個插入元件摺疊方法接受一個可選的參數，它定義了你想要摺疊到的位置。如果你想把元素放在最後，摺疊到最後，否則到開始。

來源

2011-11-27 09:35:08

在文本選擇之前/之後添加元素

回答

相關問題