Подскажите, пожалуйста, как корректно заменить символы на bbcode в textarea во время ввода, не "потеряв" курсор?
Нужно сразу после ввода m1 и m2 в textarea заменить их на ббкоды [math1][/math1] и [math2][/math2] соответственно при этом не "потерять" курсор, т.е. чтобы он после замены оказывался между открывающим и закрывающим тегами.
Что-то получилось, только в IE, если теги не на первой строке, курсор не устанавливается между открывающим и закрывающим тегами
<script type="text/javascript">
function setSelectionRange(input, selectionStart, selectionEnd) {
if (input.setSelectionRange) {
input.focus();
input.setSelectionRange(selectionStart, selectionEnd);
}
else if (input.createTextRange) {
var range = input.createTextRange();
range.collapse(true);
range.moveEnd('character', selectionEnd);
range.moveStart('character', selectionStart);
range.select();
}
}
function setCaretToPos (input, pos) {setSelectionRange(input, pos, pos);}
function insertTags(obj)
{ obj = document.getElementById('abcd');
var str = obj.value;
if(obj.value.indexOf('m1')!=-1) obj.value = str.replace('m1','[ math1][/math1 ]');
if(obj.value.indexOf('m2')!=-1) obj.value = str.replace('m2','[ math2][/math2 ]');
var tag1 = obj.value.indexOf('[ math1][/math1 ]'),
tag2 = obj.value.indexOf('[ math2][/math2 ]');
if(tag1!=-1) setCaretToPos(obj, tag1+8);
if(tag2!=-1) setCaretToPos(obj, tag2+8);
}
</script>
<textarea id="abcd" onkeyup="insertTags()" style="width:300px; height:100px;">Lorem ipsum dolor sit amet</textarea>