Javascript TinyMCE 4插入链接表单字段已禁用

我正在使用使用TinyMCE 4的gem，我正在加载

链接

插件，所有这些都是在一个颜色框弹出后启动的

TinyMCE编辑器工作正常，但“链接”按钮会弹出一个对话框来添加/编辑链接，但除目标字段外，其他字段均不可编辑

以下是相关代码：

setup_new_message: ->
  tinyMCE.init
    selector: '.tinymce'
    plugins: "textcolor link"
    menubar: false
    toolbar: "formatselect | fontselect | bold italic underline | forecolor | alignleft aligncenter alignright | bullist numlist | link"
    height: 250

  $(document).on 'focusin', (e) ->
    if $(e.target).closest(".mce-window").length
      e.stopImmediatePropagation()

我在其他stackoverflow问题/答案中找到了$（document）.on'focusin，但这对我不起作用。它确实启动了

e.stopImmediatePropagation（）

，但它没有像大家说的那样工作

---

有什么想法吗？提前感谢。

当我缩小范围后，我发现答案是我正在将TinyMCE加载到jquery.colorbox弹出窗口中。Colorbox防止任何类型的

焦点

事件/操作在其定义的容器之外发生。TinyMCE通过iframes弹出它的内容，而不是实际上在colorbox容器中

修复方法很简单：在colorbox选项中设置

trapFocus:false

，所有选项都正常工作。理解tho，这意味着用户可以从聚焦的颜色框中选择覆盖后面的元素

---

通过

根据TinyMCE的版本，解决方案是：

$(document).on('focusin', function(e) {
    var target = $(e.target);
    if (target.closest(".mce-window").length || target.closest(".tox-dialog").length) {
        e.stopImmediatePropagation();
        target = null;
    }
});

---

当然还有来自TinyMCE5和MagnificPopup兼容性的答案：

$.magnificPopup.instance._onFocusIn = function( e ) {
    try {
        if( $( e.target ).attr( 'class' ).indexOf( 'tox-' ) >= 0 ) {
            return true;
        }
    } catch( e ) {}

    $.magnificPopup.proto._onFocusIn.call( this, e );
}