What I am trying to do is move the caret to the end of the string when the element is focused.
collapseToEnd()
does not work. Instead, if you uncomment getSelection().collapseToEnd()
, it seems to remove the selection altogether or favors the user selection.
Any help would be greatly appreciated.
const div = document.querySelector('div')
div.addEventListener('focus', moveCaretToEnd)
function moveCaretToEnd() {
getSelection().setBaseAndExtent(
div.childNodes[0], div.textContent.length,
div.childNodes[0], div.textContent.length-1
)
// getSelection().collapseToEnd()
}
div {
width: 500px;
height: 150px;
font-size: 3rem;
background: skyblue;
}
<div contenteditable>This is a test</div>