Utrzymuj pozycję kursora w contenteditable div

Question

Przede wszystkim, jest to podobne do tych:

Editing Iframe Content in IE - problem in maintaining text selection

How to get caret position within contenteditable div with html child elements?

Zasadniczo piszę coś podobnego do nowego edytora tweet na Twitter. Wewnątrz zestawu div z contentEditable, parsuję tekst. Kiedy wykryje, co myślę jest URL, strip, że tekst się i zawrzeć <a> tagu wewnątrz div (np wszedł przesłanie go to www.google.com staje Go to <a href='..'>www.google.com</a>. Ale, pozycja daszek jest stracone, kiedy to zrobić.

Używanie sugestia @ Tim-Down w tych innych pozycjach SO będzie działała tylko tak długo, jak nie edytujesz DOM (jak mówi) JESTEM edytowanie DOM, więc pozycja opiekuna jest stracona

Czy to możliwe (najlepiej bez użycia biblioteki Rangy), aby osiągnąć ten cel, pracując nad bieżącym kodem

Kod, który mam w tej chwili (z innych stanowisk SO):

var saveSelection, restoreSelection; 
if (window.getSelection) { 
    // IE 9 and non-IE 
    saveSelection = function(win) { 
     var sel = win.getSelection(), ranges = []; 
     if (sel.rangeCount) { 
      for (var i = 0, len = sel.rangeCount; i < len; ++i) { 
       ranges.push(sel.getRangeAt(i)); 
      } 
     } 
     return ranges; 
    }; 

    restoreSelection = function(win, savedSelection) { 
     var sel = win.getSelection(); 
     sel.removeAllRanges(); 
     for (var i = 0, len = savedSelection.length; i < len; ++i) { 
      sel.addRange(savedSelection[i]); 
     } 
    }; 
} else if (document.selection && document.selection.createRange) { 
    // IE <= 8 
    saveSelection = function(win) { 
     var sel = win.document.selection; 
     return (sel.type != "None") ? sel.createRange() : null; 
    }; 

    restoreSelection = function(win, savedSelection) { 
     if (savedSelection) { 
      savedSelection.select(); 
     } 
    }; 
} 

i używam go tak:

$('div').on('keyup paste', function(e) { 
    var ranges = saveSelection(window); 
    var newContent = /* Get the new HTML content */; 
    $('div').html(newContent); 
    restoreSelection(window, ranges); 
}); 

Answer 1

Jeśli tekst użytkownik widzi pozostaje taka sama (co wydaje swoje pytanie sugerować jest), można użyć znaku offsetu na podstawie rozwiązanie. Mam pisał jakiś kod do tego w innym miejscu na przepełnienie stosu:

https://stackoverflow.com/a/13950376/96100

I odpowiedział również powiązany pytanie całkiem niedawno:

jQuery: Convert text URL to link as typing