HTML ContentEdtiable和子节点

Question

我正在尝试使用contentEditable属性，但是我遇到了一些与子元素相关的困难。

例如：

    <div contenteditable="true">
        <p>some text here</p>
        <p>some longer paragraphs here</p>
        <p>and some more</p>
     </div>

我有一个dblclick会触发contenteditable为true。但是，我发现我只能在文本的最开头或最后点击来设置插入符号。如果我尝试点击文本中间没有任何反应。

似乎contentedtiable仅应用<div>这就是为什么我只能点击开头或结尾来设置插入符？

奇怪的是，如果我单击文本的末尾并设置插入符号，然后使用箭头键，我就可以通过其余的文本导航插入符号。

Answer 1

您的代码完美无缺！ https://jsfiddle.net/pcvwwjoe/ 在IE 11 firefox和chrome

中进行了测试

<div contenteditable="true">
        <p>some text here</p>
        <p>some longer paragraphs here</p>
        <p>and some more</p>
     </div>

尝试刷新页面！

1 - 单击中间工作。 双箭头键等工作。