Css 如何防止换行符插入到空的可编辑div中（在Firefox中）？

我试图给一个可编辑的

div

一个占位符，如前所述

这段代码在Chrome上运行，但在Firefox上只能部分运行。在Firefox中，最初的

div

为空，并显示占位符。当我输入一些文本时，占位符消失了。到目前为止还不错。但是当我删除所有输入的文本并删除焦点时，占位符不会返回，尽管

div

应该是空的

如果我检查元素，我可以看到只要我删除最后一个字符，一个

节点就会被插入

div

。这就是为什么它不是空的原因

如何避免将

插入空的可编辑

div

[contenteditable=“true”]{
背景颜色：黄色；
}
[contenteditable=“true”]：空：不（：焦点）：：之前{
内容：attr（数据文本）；
颜色：灰色；
}
[contenteditable=“true”]：：之前{
内容：'\200b'；
}

---

作为一种解决方法，我现在在Firefox中使用observer。但我仍然对如何避免它感兴趣

(function () {
  if (/firefox/i.test(navigator.userAgent))
  {
    var observer = new MutationObserver(function(mutations) {
      mutations.forEach(function(mutation) {
        if (mutation.target.innerHTML == '<br>') {
          mutation.target.innerHTML = '';
        }
      });
    });

    document.querySelectorAll('[contenteditable="true"]').forEach(function(div) {
      observer.observe(div, { childList: true });
    });
  }
})();

（函数（）{
if（/firefox/i.test（navigator.userAgent））
{
var观察者=新的突变观察者（功能（突变）{
突变。forEach（功能（突变）{
if（mutation.target.innerHTML=='
'）{
mutation.target.innerHTML=''；
}
});
});
document.querySelectorAll（'[contentedidated=“true”]'）.forEach（函数（div）{
observer.observe（div，{childList:true}）；
});
}
})();

它又回来了。@Geek先生，我正在使用Firefox。你使用Chrome吗？是的，我使用Chrome。@Geek先生，我添加了标签，因为这似乎是Firefox特有的问题。没有看到，对不起。你找到更好的解决方案了吗？如果不是，这是最好的解决方案，但我正在复制/粘贴它。谢谢