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

前端之家收集整理的这篇文章主要介绍了强制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.f2er.com/css/215149.html

猜你在找的CSS相关文章