javascript - 有没有一种方法可以阻止可编辑的插入符号出现在IE 10中的元素上？

IE10中似乎存在一个错误，即如果我将一个元素放置在另一个带有contenteditable属性的元素上，则编辑器的插入符号将覆盖所有内容。

您可以在下面的图像和此jsFiddle中看到此行为。

我已经弄乱了很多CSS属性，却无法找到解决方案。它可以在其他浏览器中正常运行。

我之所以需要它，是因为我正在设计一种所见即所得的编辑器(TinyMCE fork)，可以在需要时工具栏在文本上向下滑动。此错误使插入符号出现在工具栏的顶部。

我想到的唯一解决方案是模糊编辑器的焦点，并在工具栏消失后重新调整焦点。但是，这将阻止用户在激活工具栏时键入内容，并且还会导致浏览器之间的行为不一致。

这个错误有解决方法吗？

最佳答案

没有办法将插入符号与IE中的另一个元素重叠。这个问题被问了很多遍:

Link 1

Link 2

...

但是，您可以在获得插入符位置后使文本区域模糊(请参阅:Caret position in textarea, in characters from the start)，然后显示您的工具栏。隐藏工具栏后，您可以再次聚焦文本区域，使用以下方法设置插入符号的位置:

function setCaretPosition(elemId, caretPos) {
    var elem = document.getElementById(elemId);

    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}

另请:Set keyboard caret position in html textbox

关于javascript - 有没有一种方法可以阻止可编辑的插入符号出现在IE 10中的元素上？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/15800409/