我有一个contentEditable
div其中我有多个标签(br
, b
, u
, i
)和文本。
我需要获取相对于 div 的插入符索引位置,包括所有标签。
例如:
<div id="h" contenteditable="true">abc<b>def<br>ghi</b>jkl</div>
如果光标位于g
and h
,我需要插入符号索引位置为14
。
问题是发现的方法使用treeWalker在这种情况下不起作用。
未找到粗体标记...可能是因为它未关闭。
我也尝试了几种方法但仍然没有运气。
我需要它来工作Firefox。
谢谢。
你试过这个吗?获取范围相对于其父容器的开始和结束偏移量
直接链接到jsfiddle:https://jsfiddle.net/TjXEG/1/
功能代码:
function getCaretCharacterOffsetWithin(element) {
var caretOffset = 0;
if (typeof window.getSelection != "undefined") {
var range = window.getSelection().getRangeAt(0);
var preCaretRange = range.cloneRange();
preCaretRange.selectNodeContents(element);
preCaretRange.setEnd(range.endContainer, range.endOffset);
caretOffset = preCaretRange.toString().length;
} else if (typeof document.selection != "undefined" && document.selection.type != "Control") {
var textRange = document.selection.createRange();
var preCaretTextRange = document.body.createTextRange();
preCaretTextRange.moveToElementText(element);
preCaretTextRange.setEndPoint("EndToEnd", textRange);
caretOffset = preCaretTextRange.text.length;
}
return caretOffset;
}
function showCaretPos() {
var el = document.getElementById("test");
var caretPosEl = document.getElementById("caretPos");
caretPosEl.innerHTML = "Caret position: " + getCaretCharacterOffsetWithin(el);
}
document.body.onkeyup = showCaretPos;
document.body.onmouseup = showCaretPos;
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)