升级Froala从2.9.2到3.1.1触发异常：Cannot use 'in' operator to search for 'defaultView' in undefined

这个错误我之前帮朋友排查过类似的，核心原因是Froala 3.x版本对实例化参数的要求和2.x完全不一样了——在2.9.2里你可以直接把jQuery对象传给FroalaEditor构造函数，但3.1.1要求必须传入原生DOM元素，不然内部代码在尝试访问DOM元素的defaultView属性时，会因为参数是jQuery对象而非原生元素，找不到对应属性从而抛出这个异常。

修复步骤 #

只需要把你的jQuery对象转换成原生DOM元素即可，有两种简单的方式：

• 使用数组下标$obj[0]获取第一个匹配的原生元素
• 使用jQuery的.get(0)方法获取原生元素

修改后的完整代码 #

$.fn.validateFroalaChange = function () {
  var $obj = $(this);
  // 将jQuery对象转为原生DOM元素后传入构造函数
  new FroalaEditor($obj[0], {
    events: {
      'contentChanged': function () {
        console.log("changed!!");
      }
    }
  });
};

额外小提醒 #

升级到Froala 3.x后还有几个细节要留意：

• 如果你习惯用jQuery链式调用初始化（比如$('.editor').froalaEditor()），这个方式在3.x里依然支持，但直接用构造函数实例化时必须传原生元素
• 部分旧版本的事件名称、配置项可能有变动，建议对照版本文档检查你项目里的其他配置是否兼容3.x

内容的提问来源于stack exchange，提问作者Amey Khanolkar