尝试在<i>内的contenteditable标记后设置carret时遇到一些困难。

这是我所拥有的:

<p contenteditable="true"><i>H</i><i>e</i><i>l</i><i>l</i><i>o</i></p>


我该如何在..假设第3个<i>标记之后放置小刀?

我已经尝试过此解决方案:

var el = document.getElementsByTagName('p')[0];
var range = document.createRange();
var sel = window.getSelection();
range.setStart(el.childNodes[0], 3);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);
el.focus();


但是我不知道如何使其与<i>标记的位置而不是chars一起使用。

最佳答案

var el = document.getElementsByTagName('p')[0];
var range = document.createRange();
var sel = window.getSelection();
range.setStart(el.childNodes[3], 0);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);
el.focus();

<p contenteditable="true"><i>H</i><i>e</i><i>l</i><i>l</i><i>o</i></p>





p中有5个子节点,如果要在子节点上设置插入符号,请使用range.setStart(el.childNodes[3], 0);

关于javascript - 子节点上的Contenteditable Set插入符号,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45352270/

10-13 04:22