Установка положения курсора в контейнере div
Добрый день!
Новичок. Изучаю Javascript. Есть такой скрипт устанавливающий положение курсора в input Элементах (<input type="text">, <textarea>...).
<!DOCTYPE html>
<html>
<head>
<title>Range</title>
</head>
<body>
<input id="in" type="text" value = "1111111111111111111">
</body>
</html>
<script>
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);
}
setCaretToPos(document.getElementById("in"), 4);
</script>
Можно ли сделать так чтобы код работал c <div contenteditable></div> Не срабатывает следующая строчка кода: input.setSelectionRange(selectionStart, selectionEnd);
<!DOCTYPE html>
<html>
<head>
<title>Range</title>
</head>
<body>
<div id="in" contenteditable>111111111111111111111</div>
</body>
</html>
<script>
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);
}
setCaretToPos(document.getElementById("in"), 4);
</script>
|
health_dim,
<!DOCTYPE html>
<html>
<head>
<title>Range</title>
</head>
<body>
<div id="in" contenteditable>111111111111111111111</div>
<script>
function setCaretToPos(elem, pos) {
var range = document.createRange();
var sel = window.getSelection();
range.setStart(elem.childNodes[0], pos);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);
}
setCaretToPos(document.getElementById("in"), 4);
</script>
</body>
</html>
|
Огромное спасибо!
Пытался разобраться по https://learn.javascript.ru/range-textrange-selection Верны ли комментарии: range.collapse(true); // граничные точки в одном месте кода sel.removeAllRanges(); //строку можно опустить т.к. в общем-то выделения кода не было sel.addRange(range); //установка курсора |
Цитата:
|
| Часовой пояс GMT +3, время: 23:00. |