如何防止在contenteditable元素中创建不间断空格？

Question

我有一个contenteditable div，当删除或添加单词时，它会创建许多不间断的空格。这是我的代码的格式：

<div id="div" contenteditable="true">
    <span>Hello</span>
    <span></span>
</div>

我尝试替换输入中的不间断空格：

document.getElementById("div").oninput = function() {
     document.getElementById("div").innerHTML.replace(" ","");
}

但这不起作用。有什么想法吗？

Answer 1

您需要将innerHTML分配给更改后的文本，如下所示：

document.getElementById("div").oninput = function() {
  document.getElementById("div").innerHTML = document.getElementById("div").innerHTML.replace(" ","");
}

因为此MDN page中所示：

  

原始字符串保持不变

因此，您需要将replace的结果分配给某些内容。

Answer 2

您已使用getElementById()，而您在id L代码中未使用任何HTM时，除了上述答案提到了innerHTML问题