强制contenteditable div在Webkit失去焦点后停止接受输入

在Chrome和Safari(以及可能的其他基于Webkit的浏览器)中,即使在div失去焦点之后,仍然可以输入一个可信的div.

我构建了一个简单的例子来说明这个问题：http://jsfiddle.net/yfcsU/3/

该示例有两个元素：一个具有contenteditable =“true”的div和一个在单击时触发contenteditable div上的模糊事件的链接.

单击链接时,contenteditable div会失去焦点,但您仍然可以键入div,任何按键都会使其重新聚焦.

这种行为在Firefox中与预期的方式不同：单击该链接将导致contenteditable div停止接受输入.

在Webkit中,有没有办法强制contenteditable div停止接受输入后失去焦点而不禁用div上的contenteditable？

解决方法

标记为正确的答案实际上是正确的,但我会添加另一个可能更直接的解决方案.在contentEditable div上调用blur()之后,你必须调用它：

window.getSelection().removeAllRanges();

在这里测试：http://jsfiddle.net/mareksuscak/oytdoxy8/

在我看来,它做了同样的工作,也解释了为什么它不能正常工作 – 通常选择范围从输入元素中移除时模糊,但它不知何地没有为contentEditable div执行,因此在输入任何字符/ libe break之后它是重点关注.

原文地址：https://www.jb51.cc/css/215149.html