我如何在焦点事件中捕捉 froala 编辑器？答案

【问题标题】：How I catch froala editor on focus event?我如何在焦点事件中捕捉 froala 编辑器？
【发布时间】：2014-07-15 12:46:45
【问题描述】：

我必须在焦点事件上为 froala 编辑器编写一个 eventListener 函数。但是我在documentation 上找不到任何事件回调，也找不到这个编辑器结构的任何输入元素。

这是重点froalaeditor 结构快照。

有什么办法

【问题讨论】：

标签： javascript wysiwyg addeventlistener onfocus froala

【解决方案1】：

$(".selector").on('editable.focus', function (e, editor) {
  // editor focused
});

还有模糊：

$(".selector").on('editable.blur', function (e, editor) {
  // editor blurred
});

并分离焦点事件：

$(".selector").off('editable.focus');

$(".selector").off('editable.blur');

【讨论】：

'.selector' 应该是 Froala 编辑器元素的选择器还是目标元素？
仅供参考，对于反应变体，您将其传递到编辑器配置对象中的“事件”键下
通过这个回调，如何从编辑器对象中获取新的/更改的 HTML？更新：想通了，新的 HTML 在 editor.el.innerHTML

【解决方案2】：

我在通过试错法发布我的问题后找到了解决方案。 jQuery 的 focusin 函数捕获任何元素的焦点事件。

这是测试代码：

      $("#editor").focusin(function(){ 
                                         console.log("editor is focused");                       
                }).focusout(function(){
                                         console.log("editor is blured"); 
                 });

【讨论】：