在可编辑内容中的粗体元素的开头移动插入符号

编程问答 2022-05-27

问题描述

我正在为存储在 JSON 中的特定数据集创建一个编辑器，并大大简化了此操作以在此处演示我的问题。在 contenteditable 元素中，我有以下 html：

<div contenteditable="true">
  <p>This is <strong>bold</strong> text.</p>
</div>

当插入符号位于强标签之前的空格末尾时，我希望我输入的任何内容也都是粗体，但是我找不到将插入符号跳转到强标签内的方法。

我尝试过的：

//Pseudo code
onkeydown() {
if(next node has strong tag) {
var sel = document.getSelection();
sel.modify ("move","forward","character");
}
}

然而，这将插入符号移动到索引 1 而不是索引 0。我明白为什么会这样，但我似乎无法找到一种方法让它跳到强标记的索引 0。我曾考虑在强者的开头插入一个隐形角色，但这似乎是一种非常棘手的方法。有什么想法吗？

测试示例：

<div contenteditable="true">
  <p>This is <strong>bold</strong> text.</p>
</div>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

contenteditablehtmljavascript