我正在使用内容可编辑的 div 作为实时协作目的的编辑器。我需要为客户端的每个用户绘制插入符号/光标。我通过在每个事件（如按键和单击）上添加和删除跨度来做到这一点。
<span id="caret1" style="fontSize:18px color:red">|</span>
我怎样才能使这个跨度不可编辑？因此，当用户将他的插入符号留在恒定位置并且另一个用户在同一位置编辑某些内容时，他不能通过退格键删除该插入符号或选择它并像文本一样对其进行编辑。
编辑：
<span id="caret1" style="fontSize:18px color:red" contenteditable=false>|</span>
至少不允许用户在跨度中写入，但用户仍然可以通过退格键删除该跨度。
几件事
1）您的源代码格式不正确。双引号太多。
"fontSize:18px" color:red"
2) 另一件事是我还没有将 contentEditable 视为一种真正的样式，我在行动中看到的工作更像是一个伪类（在 CSS 文件中被引用）或 html 标签的属性，而不是样式本身。
<span id="caret1" contentEditable="true" style="">
3）如果这些都不起作用，您可以尝试使用 javascript/jquery 方法，在该方法中删除或退格到两个光标相互重叠的位置。您可以将两个 ID 添加到同一个跨度。
`<span id="caret1 caret2" style="fontSize:18px" contenteditable:"false" color:"red">|</span> `
当 caret2 做一些不同的事情时，移出 caret1，并为 caret2 创建一个新的...
为此，您可以使用一些脚本（并且可能使用类似rangyInputs 之类的东西），并确定所选文本中是否有另一个插入符号......并且还使用一些 .on('keypress') 进行验证在删除/退格...