自定义文本编辑器控件FredCK.FCKeditorV2的使用
转角空
在快节奏时代,我不能在慢中消亡！！！——Be Your Personal Best ！！！
加博友关注他
最新日志
该作者的其他文章
博主推荐
相关日志
随机阅读
首页推荐
自定义文本编辑器控件FredCK.FCKeditorV2的使用
2010-08-16 22:45:55| 分类：C# | 标签：|字号大中小订阅
改用FCKeditor 编辑器，FreeTextBox兼容性太差了，FireFox下根本就用不了。
版本：FCKeditor 2.1.1；
语言环境：多国语言；
特性功能：所见所得；支持平台众多；支持XHTML 1.0；文本格式设置；常见的编辑；复制、粘贴、撤销、
文件上传等等功能；
授权方式：开源且免费；
官方地址：https://www.360docs.net/doc/222820206.html,/
下载地址：https://www.360docs.net/doc/222820206.html,/download/default.html
演示地址：https://www.360docs.net/doc/222820206.html,/demo/default.html
精简版本下载页(只适用于https://www.360docs.net/doc/222820206.html,，其他语言勿下)
FCKeditor不仅加上了FLASH插入功能，而且它的兼容性超强：支持多种浏览器包括IE 5.5+、Firefox 1.0+、Mozilla 1.3、Netscape 7+；无平台限制，在Windows、Mac、Linux下都能运行；可以和多种WEB语言融合包括：https://www.360docs.net/doc/222820206.html,、ASP、PHP、ColdFusion、Java、Perl；多语言支持自带47种语言包；
开源且免费；最重要的是支持XHTML1.0标准。
对于ASP网站，FCKeditor可以直接拿过来用了，不需要进行什么修改，因为FCKeditor默认就是ASP 的。但有些设置并不适合自己使用，昨天对FCKeditor进行简单的修改，以便在https://www.360docs.net/doc/222820206.html,网站的使用，
仅供参考。
一、准备工作
首先下载FCKeditor V2.1.1，下载地址：
https://www.360docs.net/doc/222820206.html,/project/showfiles.php?group_id=75348&package_id=75845；这个压缩包里并不包含https://www.360docs.net/doc/222820206.html,要用到的DLL控件，所以还要下载另外一个压缩包，下载地址：
https://www.360docs.net/doc/222820206.html,/project/showfiles.php?group_id=75348&package_id=137125。把第一个文件解压到WEB根目录，默认文件夹名为：FCKeditor；再把第二个包解压，里面包含了源代码，如果你想自己再次开发，可以双击FredCK.FCKeditorV2.csproj文件，打开https://www.360docs.net/doc/222820206.html,进行修改，所用的语言是C#；不想修改的话，直接把bin\Release下面的FredCK.FCKeditorV2.DLL文件拷到WEB目录的bin下面。
二、精简文件
因为只用到https://www.360docs.net/doc/222820206.html,，所以有必要精简一下文件。
进入FCKeditor文件夹，把所有“_”开头的文件和文件夹删掉，这些都是一些范例，只保留editor文件夹、fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了；
进入editor文件夹，删掉“_source”文件夹，里面放的同样是源文件；
退回上一级目录进入filemanager文件夹，有browser和upload两个文件夹。进入
browser\default\connectors，只保留aspx文件夹，其余的删掉；mcpuk目录亦可删除；upload也一样，
只保留aspx文件夹；
退到editor再进入images文件夹，smiley里面放的是表情图标，有msn和fun两个系列，如果你想用自己的表情图标，可以把它们都删除；如果你想用这里的表情图标那就不要删了；
lang里面放的是语言包，如果只是用简体中文，那么只保留fcklanguagemanager.js、zh-cn.js两个文件就行了，建议也保留en.js（英文）、zh.js（繁体中文）两个文件，fcklanguagemanager.js是语言配置文件，有了它才能和fckconfig.js里的设置成对，对应上相应的语言文件，一定要保留！
再退出lang文件夹，进入skins文件夹，如果你想使用FCKeditor默认的奶黄色，那就把除了default文件夹外的另两个文件夹直接删除，如果想用别的，那就看你自己的喜好了。
至此，文件精简完毕，由原来的2.55M变成现在的797K了。接着修改设置。
三、修改设置
打开位于根目录的fckconfig.js文件。
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;
这行是设置皮肤的，如果精简时保留了silver，就把路径改成skins/silver，默认就不用管它了；
FCKConfig.DefaultLanguage = 'en' ;
设置默认语言，把en改成zh-cn，即简体中文；
FCKConfig.TabSpaces = 0;
如果在编辑过程中要用到TAB键，就把0改成1；
因为FCKeditor默认是ASP的，所以要把它换成https://www.360docs.net/doc/222820206.html,。把ASP跟其它被注释掉的代码删掉，用
https://www.360docs.net/doc/222820206.html,来代替。例如：
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Conn
ector=connectors/asp/connector.asp' ;
//FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Con
nector=connectors/asp/connector.asp&ServerPath
=/CustomFiles/' ;
// https://www.360docs.net/doc/222820206.html, // FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/brows
er.html?Connector=connectors/aspx/connector.as px' ;
// ColdFusion // FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/bro wser.html?Connector=connectors/cfm/connector.cfm' ;
// Perl // FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.ht
ml?Connector=connectors/perl/connector.cgi' ;
// PHP // FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.ht
ml?Connector=connectors/php/connector.php' ;
// PHP - mcpuk // FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/mcpuk/br owser.html?Connector=connectors/php/connector.php' ;
只保留：
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Conn
ector=connectors/aspx/connector.aspx' ;
余下的代码都按照以上操作，删掉其它WEB语言，只保留https://www.360docs.net/doc/222820206.html,。也可以点这里下载我精简过的文件，注意：只适用于https://www.360docs.net/doc/222820206.html,，其他语言勿下！建议先解压到别的目录，再复制到WEB目录相对应的位置，
以免造成文件丢失。
改完后保存，FCKeditor已经完全支持https://www.360docs.net/doc/222820206.html,了。当然还有一些安全问题，只要修改相应的toolbar，鼠标右键菜单等等，因为我的后台不面对前台用户的，即没有留言本和日记回复，所以略过这些步骤。下一步是打开https://www.360docs.net/doc/222820206.html,，在https://www.360docs.net/doc/222820206.html,页面中加入FCKeditor。
四、https://www.360docs.net/doc/222820206.html,中的应用
打开项目的“资源管理器”，在引用中去掉“FreeTextBox”引用；添加“FredCK.FCKeditorV2”引用。
打开添加文章、管理文章相对应的文件以修改其中的内容。下面以“添加文章”为例。切换到“HTML”界面，删掉原来FTB注册信息，添加FCK的引用，代码如下：
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCK
editorV2" %>
并确保@ Page中的“AutoEventWireup”“validateRequest”两个值都为false，不然当你发表的文章中含有链接或是其他HTML语句时，.NET会警告你有安全隐患而出错。在form的适当位置加入FCKeditor控件，
当然form一定要有“runat="server"”，代码如下：
id可以自己命名，自己喜欢易记就行。如果程序中有检测输入是否为空的话，那么就不再是content.Text
了，而是content.Value。
至此，文件修改完毕。所有代码如下：
引用
<%@ Page language="c#" Codebehind="AdminFileAdd.aspx.cs" AutoEventWireup="false" Inherits="My
Blog.Admin.AdminFileAdd" validateRequest=false%>
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCK
editorV2" %>
其它文件按照以上方法修改完毕之后，重新生成解决方案就大功告成了，接下来就慢慢感受FCKeditor 带给你的震撼吧。还有一点要注意的是：如果你在用Windows XP SP2且启用了“弹出窗口阻止程序”，请把你的站点添加到“允许的站点”之中，不然插入图片或Flash时会提示脚本错误。
https://www.360docs.net/doc/222820206.html,/loushi_guxiong/blog/item/b2180d4c9eefc1f1d62afcad.html
百度Ueditor配置步骤
百度Ueditor配置步骤 一、官网上下载完整源码包，解压到任意目录，解压后的源码目录结构如下所示： _examples：编辑器完整版的示例页面 dialogs：弹出对话框对应的资源和JS文件 themes：样式图片和样式文件 php/jsp/.net：涉及到服务器端操作的后台文件，根据你选择的不同后台版本，这里也会不同，这里应该是jsp,php,.net third-party：第三方插件(包括代码高亮，源码编辑等组件） editor_all.js：_src目录下所有文件的打包文件 editor_all_min.js：editor_all.js文件的压缩版，建议在正式部署时才采用 editor_config.js：编辑器的配置文件，建议和编辑器实例化页面置于同一目录 二、部署UEditor到实际项目（UETest）中的步骤: 第一步：在项目的任一文件夹中建立一个用于存放UEditor相关资源和文件的目录，此处在项目根目录下建立，起名为ueditor。
第二步：拷贝源码包中的dialogs 、themes 、third-party 、editor_all.js 和editor_config.js 到ueditor 文夹中。其中，除了ueditor 目录之外的其余文件均为具体项目文件，此处所列仅供示例。 第三步：为简单起见，此处将以根目录下的index.aspx 页面作为编辑器的实例化页面，用来展示UEditor 的完整版效果。在index.aspx 文件中，首先导入编辑器需要的三个入口文件，示例代码如下： 1 2 3
文本编辑器使用使用说明
文本编辑器使用说明书
目录 1文本编辑器结构 (1) 1.1功能操作按钮栏 (1) 1.2内容栏 (1) 2功能分解 (1) 2.1功能操作按钮栏第一排 (1) 2.1.1全屏编辑 (2) 2.1.2预览 (2) 2.1.3粘贴 (2) 2.1.4粘贴为无格式文本 (2) 2.1.5从MS Word 粘贴 (2) 2.1.6撤销 (3) 2.1.7重做 (3) 2.1.8插入/编辑图像 (3) 2.1.9插入/编辑表格 (4) 2.1.10插入水平线 (4) 2.1.11插入/编辑超链接 (4) 2.1.12取消超链接 (5) 2.1.13查找 (5) 2.1.14替换 (5) 2.1.15全选 (5) 2.1.16清除格式 (5) 2.2功能操作按钮栏第二排 (5) 2.2.1格式 (6) 2.2.2字体 (6) 2.2.3大小 (6) 2.3功能操作按钮栏第三排 (6) 2.3.1空格 (6) 2.3.2加粗 (6) 2.3.3倾斜 (7) 2.3.4下划线 (7) 2.3.5删除线 (7) 2.3.6左对齐 (7) 2.3.7居中对齐 (7) 2.3.8右对齐 (7) 2.3.9两端对齐 (7) 2.3.10插入/删除编号列表 (8) 2.3.11插入/删除项目列表 (8) 2.3.12文本颜色 (8) 2.3.13背景颜色 (8) 2.3.14下标 (8) 2.3.15上标 (8) 2.3.16源代码 (9)
1文本编辑器结构 文本编辑器大体结构可以分为两部分，分别为：功能操作按钮栏和内容栏。 1.1功能操作按钮栏 功能操作按钮栏：用于对内容进行编辑。 1.2内容栏 内容栏：用于显示输入的内容。 2功能分解 在功能操作按钮栏中功能按钮分为三排，下面将分别按照每排的顺序进行逐一介绍。 2.1功能操作按钮栏第一排 功能操作按钮栏第一排中共包含16个功能按钮，如下图所示。 图2-1-1 功能操作按钮栏第一排
java课设—文本编辑器的设计与实现
淮 海 工 学 院 计算机工程学院
课程设计报告
设计名称： 选题名称： 姓 名： 面向对象课程设计 文本编辑器的设计与实现 学 号：
专业班级： 系 （院） ： 设计时间： 设计地点： 计算机工程学院 2015.6.21~2014.7.4 计算机楼机房、教室、宿舍
指导教师评语：
成绩：
签名：
年 月 日
面向对象课程设计报告
第
1
页，共
14
页
1．课程设计目的
《面向对象程序设计》是一门实践性很强的计算机专业基础课程，课程设计是学习完该课程 后进行的一次较全面的综合练习。其目的在于通过实践加深学生对面向对象程序设计的理 论、方法和基础知识的理解，掌握使用 Java 语言进行面向对象设计的基本方法，提高运用 面向对象知识分析实际问题、解决实际问题的能力。
2．课程设计任务与要求：
课程设计可选用 NetBeans、Eclipse、JBuilder 等作为开发平台以提高开发效率，尽可能熟 练掌握其中一种集成开发环境。建议采用 UML 建模技术进行系统的分析设计，在 Visio 中画出系 统用例图和类图，并将 UML 图复制到设计报告中。 通过这次设计，要求掌握以下内容： 1）面向对象技术中的继承与多态（重载和覆盖）机制、各种修饰符的使用 2）类、包、接口的定义与使用 3）常用工具类与算法的实现（数组、向量、字符串、链表） 4）Java 常用标准 GUI 组件及其事件处理 5）Java 的异常处理机制 6）Java 的数据库连接技术 7）Java 的多线程技术与动画制作 8）Java 的网络编程 任务： 设计一个类似于 Windows 记事本(Notepad)的 Java 程序。可以打开、新建、保存一个文本 文件；对选中的文本进行各种编辑操作（设置字体、字号、字型、对齐方式、背景、前景色、复 制、粘贴、剪切、查找、替换等） ；在文本中能够插入对象。简单文本编辑器提供给用户基本的 纯文本编辑功能， 能够将用户录入的文本存储到本地磁盘中。 能够读取磁盘中现有的纯文本文件， 以及方便用户进行需要的编辑功能。
Java web工程里UEditor网页编辑器的使用
Java web工程里UEditor网页编辑器的使用 第一步： 在UEditor官网下载开发版本中jsp版本的资源包，得到 ueditor1_2_6_1-utf8-jsp.zip https://www.360docs.net/doc/222820206.html,/website/download.html 第二步： 在工程WebRoot目录下新建文件夹ueditor，解压资源包，将得到的所有资源全部拷贝到WebRoot/ueditor/中。 第三步： 在src下创建包路径https://www.360docs.net/doc/222820206.html,mon，将解压得到的jsp文件夹里Uploader.java拷贝到common中去。 第四步： 将解压得到的jsp文件夹里commons-fileupload-1.2.2.jar、ueditor.jar拷贝到WebRoot/WEB-INF/lib中以添加到工程。 第五步： Ueditor默认是将文件imageUp.jsp所在目录作为上传文件的根目录，若需要修改保存根目录，则可以将uploader.java中方法private String getPhysicalPath(String path)的方法体代码修改为： //此处我修改为工程根目录/upload/日期/文件名这种格式 String realPath = this.request.getSession().getServletContext().getRealPath("/"); return new File(realPath) +"/" +path; 如果要修改upload这一级目录，可以修改uploader.java中private String savePath = "upload";该值得配置。 第六步： 回到jsp中，首先编写以下js代码： 再引入三个js文件ueditor.all.js、ueditor.config.js、lang/zh-cn/zh-cn.js，一定是在以上代码之后引入。 在需要使用编辑器的位置，添加代码如下： 标签。 3）引入相关文件 4）创建编辑器 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
文本编辑器的设计与实现
软件学院 课程设计报告书 课程名称 设计题目文本编辑器的设计与实现 专业班级 XXXXXXXXXXX 学号 xxxxxxxxxx 姓名 xxx 指导教师 2011 年11月
1 设计时间 2011年11月 2 设计目的 《面向对象程序设计》是一门实践性很强的计算机专业基础课程，课程设计是学习完该课程后进行的一次较全面的综合练习。其目的在于通过实践加深学生对面向对象程序设计的理论、方法和基础知识的理解，掌握使用Java语言进行面向对象设计的基本方法，提高运用面向对象知识分析实际问题、解决实际问题的能力，提高学生的应用能力。目前文本编辑器种类很多，所提供的功能也很多，但是能满足用户实现多种功能和进行Java的编译与运行很少，不能更好的适应当前用户的要求。本设计所完成的文本编辑器功能是针对学习Java程序语言，因此我们利用Java程序设计虚拟机和软件对用户及使用者的应用过程形成一整套完整的编写代码，编译，运行。 3设计任务 文本编辑器的设计与实现：设计一个类似于Windows记事本(Notepad)的Java程序。可以打开、新建、保存一个文本文件；对选中的文本进行各种编辑操作（设置字体、字号、字型、对齐方式、背景、前景色、复制、粘贴、剪切、查找、替换等）；在文本中能够插入对象。 4 设计内容 4.1需求分析 需求分析的任务是确定功能必须完成的工作，也就是对目标系统提出完整、准确、清晰、具体的要求。简单文本编辑器提供给用户基本的纯文本编辑功能，能够将用户录入的文本存储到本地磁盘中。能够读取磁盘中现有的纯文本文件，以及方便用户进行需要的编辑功能。文件操作能够实现新建、保存、打开文档等，编辑操作能过实现文本的剪贴、复制、粘贴等，格式操作能过实现字体设置、背景等，帮助操作能够实现关于主题的查看等功能。 4.2概要设计 4.2.1程序基本功能概括