C#对于控件ckeditor使用总结

来源：互联网发布：淘宝冷库门密封胶条编辑：程序博客网时间：2024/06/15 13:16

  今天做项目使用到ckeditor控件，自己对其中的使用总结:
对于控件的使用：
  1.下载了完整的程序之后，先要对程序中的不必要的东西进行删除。凡是文件名或文件夹名前面有"_"的文件或文件夹都可以删除，这些文件是一些说明文件或者实例文件。另外，./lang文件夹中，只保留：zh_cn.js，en.js文件即可，这个文件夹是程序的语言包，因为其它语言大家用不到，放在那里也占用空间，所以删掉。./skins文件夹是编辑器的界面，根据情况保留至少一个文件夹即可，其中kama是可自定颜色UI的文件，建议保留，当然如果不在乎空间大小的话，也可以全部上传。
2.将文件上传后，将代码：<%@ register Assembly="CKEditor.NET" Namespace ="CKEditor.NET" TagPrefix ="CKEditor" %>写在网页Page属性下面，在使用的地方输入代码<CKEditor:CKEditorControl runat="server" ID="Txtliuyan"></CKEditor:CKEditorControl>，这样ckeditor控件就可供我们使用；
  对于控件属性的修改：
  1.在上传文件中，config.js文件是控制该控件的主要样式原始值为：
/*
Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/

CKEDITOR.editorConfig = function( config )
{
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
};
可以在：CKEDITOR.editorConfig = function( config ){}修改该控件的样式，
外观样式有：

config.width = 600;                   //初始化时的宽度
config.skin='kama';                    //使用的皮肤
config.tabSpaces = 4;
config.resize_maxWidth = 600;             //如果设置了编辑器可以拖拽这是可以移动的最大宽度
config.toolbarCanCollapse = false;              //工具栏可以隐藏
//config.toolbarLocation = 'bottom';              //可选：设置工具栏在整个编辑器的底部bottom
config.resize_minWidth = 600;                   //如果设置了编辑器可以拖拽这是可以移动的最小宽度
config.resize_enabled = false;                  //如果设置了编辑器可以拖拽
config.protectedSource.push( /<\s*iframe[\s\S]*?>/gi ) ; // <iframe> tags.               //验证非法数据
config.protectedSource.push( /<\s*frameset[\s\S]*?>/gi ) ; // <frameset> tags.
config.protectedSource.push( /<\s*frame[\s\S]*?>/gi ) ; // <frame> tags.
config.protectedSource.push( /<\s*script[\s\S]*?\/script\s*>/gi ) ; // <SCRIPT> tags.
config.protectedSource.push( /<%[\s\S]*?%>/g ) ; // ASP style server side code
config.protectedSource.push( /<\?[\s\S]*?\?>/g ) ; // PHP style server side code
config.protectedSource.push( /(<asp:[^\>]+>[\s|\S]*?<\/asp:[^\>]+>)|(<asp:[^\>]+\/>)/gi ) ;
//config.startupFocus = true;
config.smiley_images = ['1.gif','2.gif','3.gif','4.gif','5.gif','6.gif','7.gif','8.gif','9.gif','10.gif','11.gif','12.gif','13.gif','14.gif','15.gif','16.gif',

'17.gif','18.gif','19.gif','20.gif','21.gif','22.gif','23.gif','24.gif','25.gif','26.gif','27.gif','28.gif','29.gif','30.gif',

'31.gif','32.gif','33.gif','34.gif','35.gif','36.gif','37.gif','38.gif','39.gif','40.gif','41.gif','42.gif','43.gif','44.gif',

'45.gif','46.gif',"47.gif",'48.gif','49.gif','50.gif','51.gif','52.gif','53.gif','54.gif','55.gif','56.gif','57.gif','58.gif',

'59.gif','60.gif','61.gif','62.gif','63.gif','64.gif','65.gif','66.gif','67.gif','68.gif','69.gif','70.gif','71.gif','72.gif'];

//自定义的一些表情图片，对应的也要将表情包中名词改变；

//设置编辑器里字体下拉列表里的字体
config.font_names= '宋体;黑体;楷体_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

//设置工具栏里面的工具最主要的config.toolbar = [
['Bold','Italic','Underline','Strike','FontSize','NumberedList','BulletedList','Outdent','Indent','JustifyLeft',

'JustifyCenter','JustifyRight','Link','Unlink','TextColor','BGColor','Image','Flash','Smiley','Table',

'RemoveFormat','Source']
];
我用的工具是：
config.toolbar =
[
   ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'],
   ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote'],
   ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
   ['Link', 'Unlink', 'Anchor'],
   ['Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak'],
   ['Font', 'FontSize'],
   ['TextColor', 'BGColor'],
   [ 'Undo', 'Redo']
];

这些工具就已经够用户使用，没有必要用那么多的工具。而且感觉多的话还可以更改。