JavaScript — восстановить позицию курсора после .replace ()

Восстановить позицию курсора после .replace ()

Вы можете попробовать следующий фрагмент кода. В своей текущей форме он заменяет == на , но позволяет заменить любую строку другой, более короткой или длинной.

Чтобы сохранить положение курсора, вы должны сохранить и восстановить selectionStart и selectionEnd . Смещение рассчитывается для учета разницы в длине между двумя строками и количества вхождений перед курсором.

Использование setTimeout гарантирует, что вновь введенный символ был вставлен в текст перед выполнением обработки.

 var area = document.getElementById("area"); var getCount = function (str, search) { return str.split(search).length - 1; }; var replaceText = function (search, replaceWith) { if (area.value.indexOf(search) {amp}gt;= 0) { var start = area.selectionStart; var end = area.selectionEnd; var textBefore = area.value.substr(0, end); var lengthDiff = (replaceWith.length - search.length) * getCount(textBefore, search); area.value = area.value.replace(search, replaceWith); area.selectionStart = start   lengthDiff; area.selectionEnd = end   lengthDiff; } }; area.addEventListener("keypress", function (e) { setTimeout(function () { replaceText("==", " "); }, 0) }); 
 {amp}lt;textarea id="area" cols="40" rows="8"{amp}gt;{amp}lt;/textarea{amp}gt; 
Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector