我需要在 JavaScript 中的 contenteditable P 元素中每次按键后更新其 innerHTML,不能使用 input 或 textarea 替代 P 元素,并且无法使用 jQuery。尽管它能正常工作,但是当 innerHTML 重置时,光标始终会回到段落开头。我尝试使用其他 SO 问题提供的有关光标和 contenteditable 的解决方案,但似乎在我的情况下无法正常工作:我想把光标放回到更新 innerHTML 之前的确切位置。
p.oninput=function(){
// Get caret position
c = window.getSelection().
getRangeAt(0).
startOffset;
console.log(c);
// Update innerHTML
p.innerHTML = p.innerHTML.toUpperCase();
// Place caret back
// ???
}
p{ border: 1px dotted red }
<p contenteditable id=p>type here
顺便说一下,不需要在IE上运行,但如果您有跨浏览器的解决方案,我也可以接受。
感谢您的帮助!