Javascript富文本编辑器,支持get和set游标位置 [英] Javascript Rich Text Editor with get AND set cursor position support
本文介绍了Javascript富文本编辑器,支持get和set游标位置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
是否有支持获取和设置光标位置的javascript富文本编辑器?
Are there any javascript Rich Text Editors that support getting and setting the cursor position?
推荐答案
我不会解释可怕的细节,但这将工作:
I won't explain the gruesome details, but this will work:
function getTextNodesIn(node) {
var textNodes = [];
if (node.nodeType == 3) {
textNodes.push(node);
} else {
var children = node.childNodes;
for (var i = 0, len = children.length; i < len; ++i) {
textNodes.push.apply(textNodes, getTextNodesIn(children[i]));
}
}
return textNodes;
}
function setSelectionRange(el, start, end) {
if (document.createRange && window.getSelection) {
var range = document.createRange();
range.selectNodeContents(el);
var textNodes = getTextNodesIn(el);
var foundStart = false;
var charCount = 0, endCharCount;
for (var i = 0, textNode; textNode = textNodes[i++]; ) {
endCharCount = charCount + textNode.length;
if (!foundStart && start >= charCount && (start < endCharCount || (start == endCharCount && i < textNodes.length))) {
range.setStart(textNode, start - charCount);
foundStart = true;
}
if (foundStart && end <= endCharCount) {
range.setEnd(textNode, end - charCount);
break;
}
charCount = endCharCount;
}
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
} else if (document.selection && document.body.createTextRange) {
var textRange = document.body.createTextRange();
textRange.moveToElementText(el);
textRange.collapse(true);
textRange.moveEnd('character', end);
textRange.moveStart('character', start);
textRange.select();
}
}
现在您只需获取元素并选择内容:
Now you just get your element and select stuff:
setSelectionRange(document.getElementById('dijitEditorBody'), 10, 50);
这篇关于Javascript富文本编辑器,支持get和set游标位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文