Курсор перемещается в начало текста, когда я обновляю текст с помощью JavaScript

я использую contenteditable, чтобы позволить пользователям редактировать информацию на веб-странице, но некоторые поля имеют требования к длине, и я хочу, чтобы они знали, когда ониЯ выполнил это требование, поэтому я изменил цвет текста, который будет обрезан, когда он нажмет, и вернется к красному.

Проблема заключается в том, что когда текст изменяется с помощью JavaScript, браузер перемещает курсор в начало строки. Кто-нибудь знает, как я могу предотвратить это поведение? Насколько я могу сказать, это проблема во всех браузерах.

Вот'Это JSFiddle.

$(element).keypress(function (event) {
    if ($(element).text().trim().length > maxChars) {
        $(element).html($(element).text().trim().substr(0, maxChars) +
            "<span class="red">" + $(element).text().trim().substr(maxChars) + "</span>");
    }
});

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

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