无法使用sourcedialog插件在ck编辑器中编辑源对话框

时间:2019-02-22 06:31:30

标签: plugins asp.net-mvc-5 ckeditor

CKEDITOR.disableAutoInline = true;
    CKEDITOR.replace('Page_title', {
        height: 100,
        customConfig: 'ckeditor-wordcount-config.js',
        wordcount: {
            maxCharCount: 41,
            showWordCount: false,
            showParagraphs: false,
            showCharCount: true,
            countSpacesAsChars: true,
            countLineBreaks: true,
        }
    });

上面是视图中的代码,下面是我用作plugin.js的插件

/**
 * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
 */

CKEDITOR.plugins.add('sourcedialog', {
    // jscs:disable maximumLineLength
    lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,el,en,en-au,en-ca,en-gb,eo,es,es-mx,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mn,ms,nb,nl,no,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%
    // jscs:enable maximumLineLength
    requires: 'dialog',
    icons: 'sourcedialog,sourcedialog-rtl', // %REMOVE_LINE_CORE%
    hidpi: true, // %REMOVE_LINE_CORE%

    init: function (editor) {
        // Register the "source" command, which simply opens the "source" dialog.
        editor.addCommand('sourcedialog', new CKEDITOR.dialogCommand('sourcedialog'));

        // Register the "source" dialog.
        CKEDITOR.dialog.add('sourcedialog', this.path + 'dialogs/sourcedialog.js');

        // If the toolbar is available, create the "Source" button.
        if (editor.ui.addButton) {
            editor.ui.addButton('Sourcedialog', {
                label: editor.lang.sourcedialog.toolbar,
                command: 'sourcedialog',
                toolbar: 'mode,10'
            });
        }
    }
});

还有

/**
 * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
 */

CKEDITOR.dialog.add('sourcedialog', function (editor) {
    var size = CKEDITOR.document.getWindow().getViewPaneSize();

    // Make it maximum 800px wide, but still fully visible in the viewport.
    var width = Math.min(size.width - 70, 800);

    // Make it use 2/3 of the viewport height.
    var height = size.height / 1.5;

    // Store old editor data to avoid unnecessary setData.
    var oldData;

    return {
        title: editor.lang.sourcedialog.title,
        minWidth: 100,
        minHeight: 100,

        onShow: function () {
            this.setValueOf('main', 'data', oldData = editor.getData());
        },

        onOk: (function () {
            function setData(dialog, newData) {
                // [IE8] Focus editor before setting selection to avoid setting data on
                // locked selection, because in case of inline editor, it won't be
                // unlocked before editable's HTML is altered. (https://dev.ckeditor.com/ticket/11585)
                editor.focus();
                editor.setData(newData, function () {
                    dialog.hide();

                    // Ensure correct selection.
                    var range = editor.createRange();
                    range.moveToElementEditStart(editor.editable());
                    range.select();
                });
            }

            return function () {
                // Remove CR from input data for reliable comparison with editor data.
                var newData = this.getValueOf('main', 'data').replace(/\r/g, ''),
                    that = this;

                // Avoid unnecessary setData. Also preserve selection
                // when user changed his mind and goes back to wysiwyg editing.
                if (newData === oldData)
                    return true;

                setTimeout(function () {
                    setData(that, newData);
                });

                // Don't let the dialog close before setData is over, to hide
                // from user blinking caused by selection restoring and setting new data.
                return false;
            };
        })(),

        contents: [{
            id: 'main',
            label: editor.lang.sourcedialog.title,
            elements: [{
                type: 'textarea',
                id: 'data',
                dir: 'ltr',
                inputStyle: 'cursor:auto;' +
                    'width:' + width + 'px;' +
                    'height:' + height + 'px;' +
                    'tab-size:4;' +
                    'text-align:left;',
                'class': 'cke_source'
            }]
        }]
    };
});

我正在使用的上述插件,但是在ckeditor中打开源对话框后,无法向段落或div添加任何背景色。

enter image description here

0 个答案:

没有答案