CKeditor 初始化问题
发布于 9 年前 作者 pro-w-xuan 5447 次浏览 最后一次编辑是 8 年前 来自 问答

ckeditor 配置代码为: CKEDITOR.editorConfig = function( config ) { // Define changes to default configuration here. For example: // config.language = ‘fr’; // config.uiColor = ‘#AADC6E’;

// Configure toolbar options config.toolbar = [ [ ‘Format’, ‘FontSize’, ‘TextColor’ ], [ ‘Bold’, ‘Italic’, ‘Underline’, ‘Strike’, ‘-’, ‘RemoveFormat’ ], [ ‘NumberedList’, ‘BulletedList’, ‘-’, ‘Blockquote’ ], [ ‘JustifyLeft’, ‘JustifyCenter’, ‘JustifyRight’, ‘JustifyBlock’ ], [ ‘Link’, ‘Unlink’ ] ];

config.allowedContent = { ‘h1 h2 h3 h4 h5 h6 p ul ol li blockquote span pre table col td tr’: { styles: ‘text-align,font-size,color’, classes: ‘fragment’ }, ‘strong em u s del ins’: true, ‘a’: { attributes: ‘!href,target’, classes: ‘fragment’ } };

// Always paste as plain text // config.forcePasteAsPlainText = true;

// Remove word formatting config.pasteFromWordRemoveFontStyles = true; config.pasteFromWordRemoveStyles = true;

// Available font sizes (label/value) config.fontSize_sizes = ‘16/16px;20/20px;24/24px;32/32px;48/48px;56/56px;64/64px;72/72px;80/80px;96/96px;128/128px;’;

// Tags that appear in font format options config.format_tags = ‘p;h1;h2;h3;pre’;

// Make dialogs simpler config.removeDialogTabs = ‘image:advanced;link:advanced’; };

初始化代码为: setupWYSIWYG: function () { window.CKEDITOR.on(‘dialogDefinition’, function (evt) { evt.data.definition.resizable = window.CKEDITOR.DIALOG_RESIZE_NONE; }); window.CKEDITOR.on(‘instanceReady’, function (evt) { evt.editor.on(‘paste’, function (ev) { if (ev.data && ev.data.type === ‘html’) { ev.data.dataValue = ev.data.dataValue .replace(/(font-size|line-height):\s?\d+(px|em|pt|%)?;/gi, ‘’); } }, null, null, 9); });

window.CKEDITOR.disableAutoInline              = true;
window.CKEDITOR.config.floatSpaceDockedOffsetY = 1;
window.CKEDITOR.config.title                   = false;

}, preloadWYSIWYG: function () { var $p = $(’<p>’).hide().appendTo(document.body), editor = window.CKEDITOR.replace($p.get(0));

if (editor) {
  editor.on('instanceReady', (function () {
    editor.destroy();
    $p.remove();
  }).bind(this));
} else {
  console.warn('CKEDITOR library is not loaded!');
}

}, render: function () { this.$replyEditor = $(’.reply_editor’, ‘#reply_form’);

var options = {};
this.editor = window.CKEDITOR.replace(this.$replyEditor.get(0), options);
this.editor.on('instanceReady', (function (err) {
  console.log(err);
  this.$replyEditor.html(this.$replyEditor.html().trim());
  this.editor.focus();

  var range = this.editor.createRange();
  range.moveToElementEditEnd(this.editor.editable());
  range.select();
}).bind(this));

}

调用顺序为 setupWYSIWYG(); preloadWYSIWYG();
render();

** 问题:** 此代码使用内联的时候编辑器正常初始化,但是当使用 replace 模式的时候,不能正常初始化。如图 untitled1.png 不能编辑,点工具条下拉菜单时,报错 untitled2.png 哪位哥们能给解决一下?谢谢

3 回复

没有人帮我解决,自己搞定了

回到顶部