javascript - 无法将光标移动到空的p标签

好的，这个问题使我发疯。

我正在内容可编辑div中实现Enter键的功能。当用户按下Enter键时，我将创建一个新的p标记，并将其附加到文档中的位置，或者如果用户在段落的中间按下Enter键，则会拆分节点。一切正常，但是我发现了这个问题。

如果在用户输入第一个字母后输入

，我追加了一个空的p标签而不在其中添加内容，则光标不会移至该p标签。但是，如果我添加空格<p></p>没关系。显然，我不想每次添加新段落时都添加空格。

我试图通过添加一个字符（例如“ A”），将光标移到该位置并随后删除“ A”来解决此问题。但是，仍然是同样的问题。

任何想法为什么会发生这种情况，我该如何解决？

编辑：我试图通过css <p>&nbsp;</p>隐藏第一个字母，但随后p标记将被完全忽略！

最佳答案

向您的<p />元素添加宽度和高度，并将display属性更改为block或inline-block

p {
    display: inline-block;
    width: 10px;
    height: 10px;
}