获取div中的html元素的位置,javascript – 如何使用html子元素在contenteditable div中获取插入位置？...

我在这里回答了一个非常相似的问题：

Editing Iframe Content in IE – problem in maintaining text selection

这是答案的略微简化版本：

如果您没有更改contenteditable元素的内容,那么以下函数将执行.在做任何你需要做的事之前调用saveSelection()然后再调用restoreSelection().如果您要更改内容,我建议使用我的Rangy库save/restore selection module.

var saveSelection, restoreSelection;

if (window.getSelection) {

// IE 9 and non-IE

saveSelection = function() {

var sel = window.getSelection(), ranges = [];

if (sel.rangeCount) {

for (var i = 0, len = sel.rangeCount; i < len; ++i) {

ranges.push(sel.getRangeAt(i));

}

}

return ranges;

};

restoreSelection = function(savedSelection) {

var sel = window.getSelection();

sel.removeAllRanges();

for (var i = 0, len = savedSelection.length; i < len; ++i) {

sel.addRange(savedSelection[i]);

}

};

} else if (document.selection && document.selection.createRange) {

// IE <= 8

saveSelection = function() {

var sel = document.selection;

return (sel.type != "None") ? sel.createRange() : null;

};

restoreSelection = function(savedSelection) {

if (savedSelection) {

savedSelection.select();

}

};

}

使用示例：

var sel = saveSelection();

// Do stuff here

restoreSelection(sel);