Сохранить позицию курсора в contenteditable div [duplicate]

На этот вопрос уже есть ответ здесь:

Сохранение изменений объектов диапазона после выделения в HTML 3 ответа

Прежде всего, это похоже на это:

Редактирование содержимого iframe в IE - проблема с поддержанием выделения текста

Как получить позицию каретки внутри contenteditable div с html дочерними элементами?

По сути, я пишу что-то похожее на новый редактор твитов в твиттере. Внутриdiv с участиемcontentEditable установить, я анализирую текст. Когда я обнаруживаю то, что я считаю URL, я удаляю этот текст и<a> тег внутри div (например, введенное сообщениеgo to www.google.com становитсяGo to <a href='..'>www.google.com</a>, НО, позиция каретки теряется, когда я это делаю.

Использование предложения @ Tim-Down в этих других сообщениях SO будет работать, только если вы не редактируете DOM (как он говорит). Я редактирую DOM, поэтому позиция каретки теряется.

Возможно ли (в идеале без использования библиотеки Rangy, на которую есть ссылки) добиться этого, работая над текущим кодом.

Код, который у меня есть на данный момент (из других сообщений 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();
        }
    };
}

И я использую это так:

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

Ответы на вопрос(1)

Ваш ответ на вопрос