如何以编程方式从内联tinyMCE实例中移除焦点？

Question

当使用tinyMCE的内联模式编辑div时，在编辑器外部单击将停用它（隐藏工具栏，基本上将div恢复为“正常”）。这很好。

在某些情况下，编辑器即使在失去焦点后仍停留在原处：

• 点击选项卡将使编辑器失去焦点（例如，将焦点移至地址栏），但编辑器和工具栏仍保留在那里。
• 单击其单击事件被另一个脚本捕获的元素（例如 Jquery-UI-Sortable 元素）将使焦点离开编辑器，但将编辑器保留在那里。

在这两种情况下，我都必须单击编辑器的主体，然后单击它以使其停用并消失。

有没有办法告诉内联编辑器实例停用？

Answer 1

这个问题很老了，但我只需回答可能想做同样事情的人。

要删除焦点，您可以将这行 CSS 添加到全局 CSS 文件中

.mce-edit-focus { outline: none !important; }

就是这样，希望对你有帮助！

Answer 2

对于任何寻找解决方案的人，您都可以在这里找到解决方案

如何在javascript中清除焦点？

document.activeElement.blur()

Answer 3

我可以尝试以下方法。

1. 从tinymce编辑器中删除类。

   $(editor.bodyElement).removeClass("mce-edit-focus")

2. 可以在 HTML 页面中定义虚拟（无操作）按钮并调用该按钮的 onclick。

   document.getElementById("noAction").click();

Answer 4

我不久前解决了类似的问题，这个CSS条目帮助了我：

.tox .tox-edit-area::before {
  border: 0 !important;
}