Question

这是人们长期遇到问题的事情，但这仍然是一个问题。在jQuery UI模式对话框中使用CKEditor时，无法访问编辑器的控制字段。例如，如果您尝试添加链接，则无法输入URL字段。

查看以前提出的解决方案，对我有用的代码如下：

orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function(event){
    // address interaction issues with general iframes with the dialog
    if (event.target.ownerDocument != this.document[0]){
        return true;
    }
    // address interaction issues with dialog window
    if ($(event.target).closest(".cke_dialog").length){
        return true;
    }
    // address interaction issues with iframe based drop downs in IE
    if ($(event.target).closest(".cke").length){
        return true;
    }
    return orig_allowInteraction.apply(this, arguments);
};

但是，这段代码并不完美，因为我有以下问题：

Firefox（v.36.0.4） - 大部分都在工作，但我收到了很多“太多的递归”错误。
在Internet Explorer（第11版）中，我收到“堆栈空间不足”错误。它大部分仍然有用。
在Chrome和Opera中，当以模式方式打开表单时，在选择日期字段的日期后，日期选择器不会关闭。它只是保持开放状态。

知道如何解决这些问题吗？我在撰写本文时使用的是最新版本，如下所示：

CKEditor v.4.4.7
jQuery v.1.11.2
jQuery v.1.11.4

Answer 1

尝试使用此代码，不知道它是如何工作的，但它可以节省我2个小时

$.fn.modal.Constructor.prototype.enforceFocus = function () {
    var $modalElement = this.$element;
    $(document).on('focusin.modal', function (e) {
        var $parent = $(e.target.parentNode);
        if ($modalElement[0] !== e.target && !$modalElement.has(e.target).length
            // add whatever conditions you need here:
            &&
            !$parent.hasClass('cke_dialog_ui_input_select') && !$parent.hasClass('cke_dialog_ui_input_text')) {
            $modalElement.focus()
        }
    })
};

控件字段在JQuery UI模式对话框中包含的CKEditor中不起作用

1 个答案: