Добрый день
Есть проблемы с текстовым полем. Есть текстовое поле
<input id="mytext" name="mytext" type="text" value="" style="width: 150px;">
Поле имеет ширину 150 пикселей и если вводить текст с клавиатуры - все нормально, после достижения текстом конца выделенной ширины текст смещается, курсор стоит в конце и видно что вводишь. А вот если мне нужно что-то динамически добавить в поле
document.getElementById('mytext').value += 'abcd';
то положение текста в поле как бы сбивается. Как будто курсор передвинули в самое начало. То, что вводилось последним не видно (потому что текст длинный и в 150 пикселей не помещается). Приходится двигать курсор в самый конец вручную.
Я подумал, что после динамического добавления содержимого в поле перемещать курсор в конец с помощью javascript. Я нашел код для перемещения курсора, но он себя ведет не так как надо мне.
function setCaretPosition(el, pos)
{
if (el.createTextRange)
{
// IE
var range = el.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
el.focus();
}
else if (el.selectionEnd)
{
// Gecko
el.selectionEnd = pos;
el.selectionStart = pos;
el.focus();
}
}
setCaretPosition(
document.getElementById('mytext'),
document.getElementById('mytext').length
);
В IE8, хроме он работает верно, курсор передвигается в конец вместе с текстом и его видно. А вот в Firefox курсор стает в нужное положение, но сам текст не смещается к курсору и курсор не видно. Только после того как начать вводить с клавиатуры текст смещается к положению каретки. В опере вообще пока вручную курсор не установить в поле ввода, курсор вообще никуда не передвинется.
Мне как-то нужно сделать, чтобы в поле ввода текст не смещался к началу после динамического добавления содержимого в него. А как сделать это я не пойму. Может кто-то подскажет?
