0

我为 CKEditor 4 编写了一个“简单”插件来插入一个带有数据属性和类的 div(数据属性是通过一个简单的对话窗口设置的)。除了单击确定外,一切正常,实际编辑器窗口中没有任何内容。有人可以看看我下面的代码,并指出我哪里出错了。谢谢。

编辑器配置

CKEDITOR.editorConfig = function (config) {
config.BaseHref = 'http://cdn.aoec.com/';
config.extraPlugins = 'contactforms,autogrow,justify,filebrowser,showblocks,tabletools,tweetabletext,widget,widgetbootstrap,widgettemplatemenu,wsc,moxiemanager,video,bootstrapCollapse,image2';
config.autoGrow_minHeight = 400;
config.contentsCss = '/content/styles/site.css';
config.skin = 'flat';
config.allowedContent = true;
config.bootstrapCollapse_managePopupContent = true;
config.toolbar = [
    ['Source', '-', 'Templates', 'ShowBlocks'],
    ['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord'],
    ['Link', 'Unlink', 'Anchor'], ['Table', 'TableTools', 'HorizontalRule', 'SpecialChar'],
    ['CreatePlaceholder', 'Image', 'Video'],
    ['Bold', 'Italic', 'Strike', 'Subscript', 'SuperScript', '-', 'RemoveFormat', 'Styles', 'Format'],
    ['NumberedList', 'BulletedList', '-', 'BlockQuote'],
    ['createDiv', 'JustifyLeft', 'JustfiyCenter', 'JustifyRight', 'JustifyBlock'],
    ['TweetableText'], ['WidgetTemplateMenu'],
    ['BootstrapCollapse'], ['ContactForms']
];
};

插件.js

CKEDITOR.plugins.add('contactforms', {
icons: 'contactforms',
init: function (editor) {
    editor.addCommand('contactforms', new CKEDITOR.dialogCommand('contactformsdialog', {
        allowedContent: 'div[class,data-form-id]'
    }));

    editor.ui.addButton('ContactForms', {
        label: 'Insert a Contact Form',
        command: 'contactforms',
        toolbar: 'insert'
    });

    CKEDITOR.dialog.add('contactformsdialog', this.path + 'dialogs/contactforms.js');
}
});

联系表格.js

CKEDITOR.dialog.add('contactformsdialog', function(editor) {
return {
    title: 'Insert a Contact Form',
    minWidth: 320,
    minHeight: 200,

    contents: [
        {
            id: 'tab-basic',
            label: 'Basic Settings',
            elements: [
                {
                    type: 'text',
                    id: 'formid',
                    label: 'Form ID',
                    validate: CKEDITOR.dialog.validate.notEmpty("Form ID field cannot be empty.")
                }
            ]
        }
    ],
    onOK: function() {
        var dialog = this;

        var theForm = editor.document.createElement('div');
        theForm.setAttribute('class', 'contactform');
        var theFormId = dialog.getValueOf('tab-basic', 'formid');
        theForm.setAttribute('data-form-id', theFormId);
        editor.insertElement(theForm);


    }
};

});

提前致谢...

4

1 回答 1

0

好吧,我发现了错误。onOK 应该是 onOk。Captial K 是问题所在。

于 2015-10-26T09:44:54.640 回答