插入文本

我使用下面的函數插入文本光標所在：插入文本

function pasteHtmlAtCaret(html) { 
    var sel, range; 
    if (window.getSelection) { 
     // IE9 and non-IE 
     sel = window.getSelection(); 
     if (sel.getRangeAt && sel.rangeCount) { 
      range = sel.getRangeAt(0); 
      range.deleteContents(); 

      // 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); 

      // Preserve the selection 
      if (lastNode) { 
       range = range.cloneRange(); 
       range.setStartAfter(lastNode); 
       range.collapse(true); 
       sel.removeAllRanges(); 
       sel.addRange(range); 
      } 
     } 
    } else if (document.selection && document.selection.type != "Control") { 
     // IE < 9 
     document.selection.createRange().pasteHTML(html); 
    } 
}

然後，我有：

然而，當我點擊跨度，文本不會附加到contenteditable（因爲它失去了焦點），而是在其內部。

我該如何解決這個問題？我需要將文本插入到光標所在的contenteditable內，如果光標不在那裏，那麼文本應該追加在contenteditable文本的末尾。

來源

2013-05-16 enb081

的jsfiddle鏈接無法正常工作，請調查一下。 –

如果工作正常，我不會在這裏發佈。 – enb081

我覺得這是你的目標：http://stackoverflow.com/questions/2213376/how-to-find-cursor-position-in-a-contenteditable-div – mauretto

老實說，最快的解決辦法是使用CSS的輸入按鈕，使它看起來像什麼的跨度應該的。快速和骯髒的，但它的作品...

來源

2013-05-16 08:27:45

感謝您的回答，問題不在於使用span而不是按鈕，而是將文本「無處不在」在html中當光標不在contenteditable上時。我[修正]（http://jsfiddle.net/VzbYJ/32/）它。 – enb081

通過跟蹤光標位置出來的專區內的全過程。所以當用戶離開它時，你仍然保存了光標位置，所以它把光標放在最後一個地方。如果需要代碼，請詢問。

來源

2014-06-21 17:49:54

回答

相關問題