当另一个输入焦点时，contenteditable div 失去选择

我对 contenteditable div 有疑问。当我想在其上执行一个简单的命令（如粗体或斜体）时，我执行以下操作：

• 记住div（因为点击粗体按钮后它会失去焦点）
• 单击按钮时，我重新聚焦 div 并执行粗体命令
• 一切正常

现在，当我尝试做更困难的事情时，问题就出现了。例如，我想显示一个带有输入字段的自定义对话框：

• 记住div
• 单击按钮时，会显示一个对话框（一切仍然正常）
• 用户将输入字段聚焦在该对话框上（这就是一切崩溃的地方）

这样做的问题是，一旦输入元素获得焦点，不仅我的 contenteditable div 失去焦点 - 它还会失去选择并在我重新聚焦它时将光标移动到开头。

所以我的问题是：在我关注另一个输入元素后，如何防止 contenteditable div 失去其选择？

如果 input 和 contenteditable 元素位于同一文档中，您将无法防止 contenteditable 元素中的选择被破坏。但是，您可以做的是在输入框获得焦点之前保存选择，并在对话框关闭后恢复选择。

这是一些简单的示例代码：

https://stackoverflow.com/a/3316483/96100

这是一个更完整的例子：

https://stackoverflow.com/a/4690057/96100

如果将 input 或 contenteditable 元素放置在单独的 iframe 中，大多数浏览器（尽管不是 IE）将保留原始选择。