Javascript 在contenteditable内联元素的索引0处写入

我有一个contenteditable

元素，它包含文本，在这个
元素中有一个内联元素，它是

contenteditable不允许我在

我用小提琴演示了这个问题：

现在打开浏览器控制台，然后尝试在内联
中的索引0处键入任何内容。如您所见，文本输入将不会放置在索引0处，而是放置在第一个文本节点的最后一个索引处

我试图用
rangy.js
改变这种行为

这样做的目的是检查第一个文本节点中是否有放置在最后一个索引处的carret，然后按下向右箭头，我会将carret放置在第二个节点中的索引0处。但问题依然存在

      //rangy try without the if-statement.       
      var nodes = $el[1].childNodes, index = 0;
      var range = rangy.createRange();
      //Setting the start at node 2 index 0.
      range.setStart(nodes[1], index);
      range.collapse(true);
      var sel = rangy.getSelection();
      sel.setSingleRange(range);

这是一种特定于实现（浏览器）的行为

答复：


给定一个dom，同一可见位置有多个dom位置，UA的当前位置会有所不同，哪个位置被视为
可打印位置。示例：给定
foobarbaz


光标位于foo和bar之间时，会发生插入：


IE：点击，外部B箭头，内部
FF：点击，外面。从标签内部的箭头，内部。从标签外部的箭头，外部
Chrome：总是出去



正如您所看到的，在不同的浏览器中，行为是不同的。在IE和FF中，您可以在
span
内单击并使用箭头键移动到第一个位置，Chrome将始终将光标放在
span
外。此外，对于FF，您只能使用箭头键从
span
内部移动，如果从外部移动，光标应保持在外部。
谢谢。我确实理解这个问题。问题是是否有默认浏览器行为的解决方法。@JonathanAndersson：没有，因为无法区分用户的意图，他们实际上是想在标记的开头还是在上一个textnode的结尾插入字符。