FCKeditor简介及常用配置 在网页中使用FCKeditor FCKeditor字符转义的问题
FCKeditor提供2中创建实例的方法：
方法一：在需要显示FCKeditor编辑器的地方插入以下js代码：
<script language="javascript">
? // 创建相当于<textarea name="editor" style="width:100%;"></textarea>的对象
? // 参数’editor’是产生的textarea的name值
? var oFCKeditor = new FCKeditor(‘editor’) ;
? oFCKeditor.BasePath?= "$link.ContextPath/js/FCKeditor/" ; // 必须指定
? oFCKeditor.Config["BaseHref"]="$link.ContextURL/"; // 保证相对路径相对于上下文
? oFCKeditor.Config["DefaultLanguage"]="zh-cn"; // 默认语言
? oFCKeditor.Width = "100%"; // 编辑器宽度
? oFCKeditor.Height = "370"; // 编辑器高度
? oFCKeditor.Create() ;
</script>
方法二：在页面的onload事件中,添加以下代码以替换一个已经存在的TEXTAREA标记
<html>
? <head>
??? <script type="text/javascript">
????? window.onload = function() {
??????? var oFCKeditor = new FCKeditor(‘MyTextarea’) ;
??????? oFCKeditor.ReplaceTextarea() ;
????? }
??? </script>
? </head>
? <body>
??? <textarea id="MyTextarea" name="MyTextarea">This is <b>the</b> initial value.</textarea>
? </body>
</html>
方法二适合于需要给编辑器赋初始值的情况。
FCKeditor功能强大，但要真正符合我们的需求还需要做必要的修改，以下将对图片上传功能做相关的修改说明：
1.打开文件FCKeditor\editor\dialog\fck_image\fck_image.js，找到以下行：
window.parent.AddTab( ‘Info’, FCKLang.DlgImgInfoTab ) ;
FCKLang.DlgImgInfoTab表示插入图片对话框中的“图像”标签，将该行转移到第二个if语句后面，这样插入图片对话框打开时默认显示的标签将不是“图像”。根据需要此行也可以不改动。
2.打开文件FCKeditor\fckconfig.js，增加一个函数contextPath：
function contextPath(str){
? var ctx = "";
? var index = str.indexOf("/");
? if(index == 0){
??? var index2 = str.substring(1).indexOf("/");
??? if(index2 == -1){
?????? index2 = str.substring(1).length;
??? }
??? ctx = str.substring(1,index2 + 1);
? } else {
??? ctx = str.substring(0,index);
? }
? return "/" + ctx;
}
修改FCKConfig.ImageUploadURL为：
FCKConfig.ImageUploadURL = contextPath(FCKConfig.BasePath) + "/fileList.do?type=uploadImg";
3.打开文件FCKeditor\editor\dialog\fck_image.html，找到id分别为divInfo和divUpload的div行互换，目的是配合上面的修改1，实现“上传”标签在“图像”标签之后。
4.增加一个文件imgUploadComplete.vm，用于在文件上传完毕后调用插入图片对话框中的函数，将上传的图片信息传递给插入图片对话框。文件源码如下：
<html>
<head><title></title>
<script language="javascript">
? window.parent.OnUploadCompleted($!errorNumber, "$!imgSrc", "$!fileName", "$!data");
</script>
</head>
<body></body>
</html>
$!errorNumber等变量由后台程序赋值。
函数OnUploadCompleted位于FCKeditor\editor\dialog\fck_image\fck_image.js中，主要是对图片上传完之后的处理，如提示信息等，可以根据需要酌情修改。
图片上传原理
=======================================================================
在插入图片对话况中的上传页面中（即FCKeditor\editor\dialog\fck_image\fck_image.js），有一个不可见的name值为UploadWindow的iframe，上传图片时form的target就是指向此iframe，图片上传完后此iframe中的页面就跳转到页面imgUploadComplete.vm，此页面一加载就马上调用方法OnUploadCompleted将上传图片的信息返回给插入图片对话框，此信息中最主要的是图片上传后的相对于网站的相对地址。
FCKeditor字符转义的问题
=======================================================================
在没有对FCKeditor作任何配置时，FCKeditor会对以下字符作相应转义：
"转换为"e;
‘转换为'
<转换为<
>转换为>
&转换为&
?转换为
其中，通过配置FCKConfig.ProcessHTMLEntities为false可以阻止"和’的转义，而?的自动转义我个人认为是一个bug。
在FCKeditor\fckeditor.js文件中增加一个函数：
function restoreHtmlEntity(htmlText){
? var text = htmlText;
? text = text.replace(/</g,’<’);
? text = text.replace(/>/g,’>’);
? text = text.replace(/&/g,’&’);
? return text;
}
功能是将字符串htmlText中的<,>h和&转义后的字符还原，这个函数在页面中提交数据到后台时会用到。具体用法如下：
var text = FCKeditorAPI.GetInstance(‘editor’).GetXHTML(true); // editor为编辑器的name值
document.myForm.Body.value = restoreHtmlEntity(text); // 调用函数restoreHtmlEntity还原转义字符
另外还要修改FCKeditor.prototype._HTMLEncode函数，将其中的正则表达式替换语句注释掉，目的是禁止对双引号、尖括号等字符转义。
对?的自动转义问题的解决方法:
1.找到文件FCKeditor\editor\js\fckeditorcode_ie.js,定位到第29行,找到方法名为FCKXHtmlEntities.Initialize的函数体,在函数的最后2行找到FCKXHtmlEntities.Entities={ ‘?’:'nbsp’ },将此语句改成FCKXHtmlEntities.Entities={}
2.找到文件FCKeditor\editor\js\fckeditorcode_gecko.js,定位到第28行,找到方法名为FCKXHtmlEntities.Initialize的函数体,在函数的最后2行找到FCKXHtmlEntities.Entities={ ‘?’:'nbsp’ },将此语句改成FCKXHtmlEntities.Entities={}