在文本选择之前/之后添加元素

我正在寻找允许我在选定文本之前或之后构建某些元素的函数。类似这样的一个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

在文本选择之前/之后添加元素

回答

相关问题