有没有办法重新排列 CKEditor 对话框中的选项卡？答案

【问题标题】：Is there a way to rearrange the tabs in CKEditor dialog?有没有办法重新排列 CKEditor 对话框中的选项卡？
【发布时间】：2017-04-04 14:10:34
【问题描述】：

我已经在 CKEditor 中有这段代码：

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


    if ( dialogName == 'image' ) {
        dialog.on('show', function () {
            this.selectPage('Upload');
    });

       dialogDefinition.removeContents( 'Link' );
       dialogDefinition.removeContents( 'advanced' );
       var infoTab = dialogDefinition.getContents( 'info' );

       infoTab.remove( 'txtAlt' );
       infoTab.remove( 'txtBorder' );
       infoTab.remove( 'txtHSpace' );
       infoTab.remove( 'txtVSpace' );
       infoTab.remove( 'cmbAlign' );

       var upTab = dialogDefinition.getContents( 'Upload' );
       var upButton = upTab.get( 'uploadButton' );
       var uploadBut = upTab.get( 'upload' );

       upButton.label = 'Upload Image';
       uploadBut.label = 'Upload Image';
    }
});

当您点击 CKEditor 上的上传图片按钮时，结果如下：

enter image description here

这段代码：

if ( dialogName == 'image' ) {
    dialog.on('show', function () {
        this.selectPage('Upload');
});

将“上传”选项卡设置为默认值。而且效果很好。

但我真正想做的是将“上传”选项卡放在“图像信息”选项卡之前。

enter image description here

CKEditor API 中有什么可以让我这样做的吗？还是我必须修改 dialog-plugin.js 才能做到这一点？如果是后者，我该如何开始呢？我正在使用最新版本的 CKEditor...

【问题讨论】：

标签： javascript jquery ckeditor

【解决方案1】：

所以这是一种变通方法，我认为这不是一个很好的解决方案，但它确实有效......

dialogDefinition.removeContents( 'Upload' );
dialogDefinition.addContents(upTab, 'info');

通过将这些放在代码的末尾，您可以删除“上传”标签并立即添加它，但这次您将它放在“信息”标签之前。

【讨论】：

它工作正常，但它不确定地停止自动比例图像宽度与高度，并且图像高度和宽度也没有保存在图像信息选项卡上。