Question

默认情况下，CKEditor的对话框窗口显示在页面中间，但如果页面是高度较高的iframe，则对话框会显示在页面下方。

是否可以配置CKEditor将对话框放在页面的不同象限中？例如顶部中间？

Answer 1

是的，MDaubs提供的链接将指导您做您想做的事。

过去我必须执行此操作，以下代码段将演示针对您的问题的解决方案：

CKEDITOR.on('dialogDefinition', function(e) {
    var dialogName = e.data.name;
    var dialogDefinition = e.data.definition;
    dialogDefinition.onShow = function() {
            this.move(this.getPosition().x,0); // Top center
    }
})

您可以将其放在配置文件或jQuery的ready函数中。

Answer 2

zaf解决方案的工作原理是它有助于定位对话框，但我发现它会产生一系列副作用，说明对话框的功能如何（无法在图像对话框中显示图像的URL）一个例子）。

事实证明，被覆盖的原始onShow()方法会返回一个我们应该保留的有意义的值。这可能是由于插件或其他东西，但这里的代码最终对我有用：

CKEDITOR.on('dialogDefinition', function(e) {
  var dialogName = e.data.name;
  var dialogDefinition = e.data.definition;
  var onShow = dialogDefinition.onShow;
  dialogDefinition.onShow = function() {
    var result = onShow.call(this);
    this.move(this.getPosition().x, $(e.editor.container.$).position().top);
    return result;
  }
});

Answer 3

这可能是你正在寻找的方式：

Programatically set the position of CKEditor's dialogs

Answer 4

我和Yehonatan有同样的问题，通过Google发现这个问题的速度非常快。但是在使用zaf提供的答案后，当编辑器加载到iframe中时，我仍然没有得到一个对话框以显示在正确的位置。

我使用offset（）方法在工具栏下面放置一个对话框，而不是position（）方法。与jonespm的响应一起，我来到这个代码似乎非常好，也与现有的对话框一起使用。

CKEDITOR.on('dialogDefinition', function(e) {
 var dialogName = e.data.name;
 var dialogDefinition = e.data.definition;
 var onShow = dialogDefinition.onShow;

 dialogDefinition.onShow = function() {

    this.move(this.getPosition().x, jQuery(this.getParentEditor().container.$).offset().top);

    if (typeof onShow !== 'undefined' && typeof onShow.call === 'function')
    {
        return onShow.call(this);
    }

 }  
});

希望这段代码可以帮助其他人解决与我相同的问题。

Answer 5

正确的语法是：

CKEDITOR.on('dialogDefinition', function(ev) {
    var dialogName = ev.data.name;
    var dialogDefinition = ev.data.definition;
    var dialog = dialogDefinition.dialog;
    if (dialogName == 'image2') {
        dialogDefinition.onShow = CKEDITOR.tools.override(dialogDefinition.onShow, function(original) { 
            return function() {
                original.call(this);
                CKEDITOR.tools.setTimeout( function() {

                    /*do anything: this.move(this.getPosition().x, $(e.editor.container.$).position().top);*/

                }, 0);
            }
        });
    }
});

ckeditor对话框定位

5 个答案: