Ckeditor调用示例
MyCkEditor.js
//编辑器工作模式判断 function isWysiwygareaAvailable() { if (CKEDITOR.revision == ('%RE' + 'V%')) { return true; } return !!CKEDITOR.plugins.get('wysiwygarea'); } //启动ckeditor编辑页面区块 function htmlCkeditor(id) { var obj = $('#' + id); var editor; if (CKEDITOR.env.ie && CKEDITOR.env.version < 9) CKEDITOR.tools.enableHtml5Elements(document); CKEDITOR.config.height = obj.height(); CKEDITOR.config.width = obj.width(); var wysiwygareaAvailable = isWysiwygareaAvailable(); var editorElement = CKEDITOR.document.getById(id); if (wysiwygareaAvailable) { editor = CKEDITOR.replace(id); } else { editorElement.setAttribute('contenteditable', 'true'); editor = CKEDITOR.inline(id); } var cssFiles = document.getElementsByTagName('link'); var css = []; for (var i = 0; i < cssFiles.length; i++) { var file = cssFiles[i]; css.push(file.href); } editor.config.contentsCss = css; return editor; } //启动编辑模式 var selectEditElement, oldCss, oldZindex; function startEditModel() { $(document).unbind("click"); $(document).bind("click", function (e) { var curr = e.originalEvent.srcElement; if (selectEditElement != curr && curr.id != 'btnEditorModel') { $(selectEditElement).css('border', oldCss).css('z-index', oldZindex); oldCss = $(curr).css('border'); oldZindex = $(curr).css('z-index'); $(curr).css('border', '1px dotted red').css('z-index', '9995').on('dblclick', function () { this.id = this.id || 'ck_' + (new Date().getTime()); htmlCkeditor(this.id); }); selectEditElement = curr; e.stopPropagation(); } }); } //终止编辑模式 function endEditModel() { //解除页面文档的点击事件绑定 $(document).unbind("click"); //还原选中的页面区块样式 $(selectEditElement).css('border', oldCss).css('z-index', oldZindex); for (var editor in CKEDITOR.instances) { //还原编辑器覆盖的区块 $('#' + editor).css({ visibility: '' }).show(); //还原编辑器覆盖的区块 $('#' + editor).unbind("dblclick");; //销毁编辑器实例 CKEDITOR.remove(CKEDITOR.instances[editor]); //移除编辑器Jquery对象 $('#cke_' + editor).remove(); } } //(function () { // $('body').append('<div id="btnEditorModel" style="width:160px; height:30px; line-height:30px; text-align:center; vertical-align:middle;border-bottom-left-radius:5px;border-bottom-right-radius:5px;background-color:#25b3d3; position:fixed; top:0px; right:180px;font-weight:bolder;font-size:18px;color:#88FF88;">Start Edit</div>'); // $('#btnEditorModel').on("click", function (e) { // if (this.innerHTML == 'Start Edit') { // this.innerHTML = 'End Edit'; // startEditModel(); // } else { // this.innerHTML = 'Start Edit'; // endEditModel(); // } // }); //}());
config.js
/** * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved. * For licensing, see LICENSE.md or http://ckeditor.com/license */ CKEDITOR.editorConfig = function( config ) { // Define changes to default configuration here. For example: // config.language = 'fr'; // config.uiColor = '#AADC6E'; config.toolbar = 'Full'; //config.toolbar_Full = [ // ['NewPage', 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', 'Templates', 'Preview'], // ['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'], // ['Link', 'Unlink', 'Anchor', 'Iframe'], // ['Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar'], // ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript', 'RemoveFormat', 'TextColor', 'BGColor'], // ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote', 'CreateDiv', 'bidiltr', 'bidirtl'], // ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'], // ['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'SpellChecker', 'Scayt'], // ['Language', 'Styles', 'Format', 'Font', 'FontSize'], // ['Maximize', 'ShowBlocks'], ['Source'], ['complete'] //]; config.toolbar_Full = [ ['NewPage', 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', 'Templates', 'Preview'],['Link', 'Unlink'], ['Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar'], ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript', 'RemoveFormat', 'TextColor', 'BGColor'], ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote', 'CreateDiv', 'bidiltr', 'bidirtl'], ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'], ['Maximize', 'ShowBlocks'], ['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'SpellChecker', 'Scayt'], ['Styles', 'Format', 'Font', 'FontSize','Source'] ]; config.extraPlugins += (config.extraPlugins ? ',complete' : 'complete'); // config.font_names = 'Arial;Times New Roman;Verdana'; //config.font_names = "Arial/Arial, Helvetica, sans-serif;Comic Sans MS/Comic Sans MS, cursive;Courier New/Courier New, Courier, monospace;Georgia/Georgia, serif;Lucida Sans Unicode/Lucida Sans Unicode, Lucida Grande, sans-serif;Tahoma/Tahoma, Geneva, sans-serif;Times New Roman/Times New Roman, Times, serif;Trebuchet MS/Trebuchet MS, Helvetica, sans-serif;Verdana/Verdana, Geneva, sans-serif"; config.font_names = '宋体/SimSun;新宋体/NSimSun;仿宋/FangSong;楷体/KaiTi;仿宋_GB2312/FangSong_GB2312;' + '楷体_GB2312/KaiTi_GB2312;黑体/SimHei;华文细黑/STXihei;华文楷体/STKaiti;华文宋体/STSong;华文中宋/STZhongsong;' + '华文仿宋/STFangsong;华文彩云/STCaiyun;华文琥珀/STHupo;华文隶书/STLiti;华文行楷/STXingkai;华文新魏/STXinwei;' + '方正舒体/FZShuTi;方正姚体/FZYaoti;细明体/MingLiU;新细明体/PMingLiU;微软雅黑/Microsoft YaHei;微软正黑/Microsoft JhengHei;' + 'Arial Black/Arial Black;' + config.font_names; config.allowedContent = true //是否保留样式 config.disableObjectResizing = false; //图片表格大小调整功能 config.disableNativeTableHandles = true; //表格编辑功能(plugins/wysiwygarea/plugin.js) config.startupMode = 'wysiwyg'; config.stylesCombo_stylesSet = 'default'; //是否载入样式文件(plugins/stylescombo/plugin.js) config.resize_enabled = false; //禁止调整编辑器大小(考虑到页面选中编辑的区块大小,目前不予修改) //config.filebrowserUploadUrl = "Blog/CkeditorUpload"; //config.filebrowserImageBrowseUrl = 'Blog/CkeditorImageUpload'; //config.filebrowserFlashBrowseUrl = 'Blog/CkeditorFlashUpload'; config.filebrowserImageUploadUrl = '../CkEditor/ImageUpload'; config.filebrowserFlashUploadUrl = '../CkEditor/FlashUpload'; config.filebrowserAudioUploadUrl = '../CkEditor/AudioUpload'; config.saveBlockHtmlUrl = '../CkEditor/Save'; config.language = 'en'; //config.skin = 'moono'; };
后台接受上传图片的方法:
public ContentResult ImageUpload(string CKEditorFuncNum) { var types = "jpg,gif,png".ToLower().Split(','); var result = "<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction(" + CKEditorFuncNum + ",'"; if (Request.Files.Count > 0) { var user = CommonController.GetxAccountData(); var account = user == null ? "Default" : user["xAccountCode"].ToString(); var file = Request.Files[0]; var fileName = file.FileName.Substring(file.FileName.LastIndexOf('\\') + 1); var path = Server.MapPath("~") + "Images\\" + account; var msg = ImageHelper.SaveImage(file, path, fileName, types, 5); result += "http://" + Request.Url.Authority + "/Images/" + account + "/" + fileName + "','" + msg + "');</script>"; } else { result += "','请选择需要上传的文件!');</script>"; } return Content(result); }