fckeditor.js诠释
fckeditor.js注释代码?/**? ??*? ??*?***********CopyRight**************? ??*-------Annotated?by?nilea
fckeditor.js注释
代码
?
/**? ??*? ??*?***********CopyRight**************? ??*-------Annotated?by?nileader-----? ??*-----Version?1.00???2009-10-18-----? ??*-----Once?copied,?marked?http://blog.csdn.net/nileader? ??*? ??*?FCKeditor??类?????annotated?by?nileader? ??*?@param?{Object}?instanceName?编辑器的唯一名称(相当于ID)?是不可省参数,? ??*?width,height,toolbarset,value?都是?可选参数? ??*/?? ??var?FCKeditor?=?function(?instanceName,?width,?height,?toolbarSet,?value?)?? ?? {?? ????????//编辑器的基本属性???注意:这些东西优先于FCKConfig.js中的配置?? ?? ??????? ??????this.InstanceName????=?instanceName?;??????????????//编辑器的唯一名称(相当于ID)(必须有!)?? ?? ????this.Width????????????=?width????????????||?'100%'?;???//宽度???默认是100%???????? ?? ????this.Height????????????=?height????????||?'200'?;????//宽度???默认是200?? ?? ????this.ToolbarSet????????=?toolbarSet????||?'Default'?;//工具集名称,默认值是Default?? ?? ????this.Value????????????=?value????????????||?''?;???????//初始化编辑器的HTML代码,默认值为空?? ?? ??????????????????//编辑器初始化的时候默认的根路径,?其作用是编写fck中,凡是用到的路径,均从FCKeditor.BasePath目录开始??????默认为/Fckeditor/?? ?? ????this.BasePath????????=?FCKeditor.BasePath?;???????? ?? ????this.CheckBrowser????=?true?;??????????????????????//是否在显示编辑器前检查浏览器兼容性,默认为true?? ?? ????this.DisplayErrors????=?true?;??????????????????????//是否显示提示错误,默为true?? ?? ????this.Config????????????=?new?Object()?;?????????????? ?? ????//?Events?? ?? ????this.OnError????????=?null?;????//?function(?source,?errorNumber,?errorDescription?)自定义的错误处理函数?? ?? }?? ??FCKeditor.BasePath?=?'/fckeditor/'?;?????//?fck默认的根目录?? ?? FCKeditor.MinHeight?=?200?;?????????//高和宽的限制?? ?? FCKeditor.MinWidth?=?750?;?? ??FCKeditor.prototype.Version????????????=?'2.6.5'?;??//版本号?? ?? FCKeditor.prototype.VersionBuild????=?'23959'?;?? ?? /**? ??*?调用CreateHtml()来生成编辑器的html代码并在页面上输出编辑器? ??*/?? ??FCKeditor.prototype.Create?=?function()?? ?? {?? ??????//调用createhtml()方法?? ?? ????document.write(?this.CreateHtml()?)?;?? ?? }?? ??/**? ??*?@return?sHtml?用于生成编辑器的html代码? ??*/?? ??FCKeditor.prototype.CreateHtml?=?function()?? ?? {?? ??????//?检查有无InstanceName??如果没有则不生成html代码?? ?? ????if?(?!this.InstanceName?||?this.InstanceName.length?==?0?)?? ?? ????{?? ??????????this._ThrowError(?701,?'You?must?specify?an?instance?name.'?)?;?? ?? ????????return?''?;?? ?? ????}?? ??????//函数的返回值?? ?? ????var?sHtml?=?''?;?? ?? ????/*? ??????*?当用户的浏览器符合预设的几种浏览器时,? ??????*?生成一个id="this.instancename"?name="this.instancename"的文本框,事实上的内容储存器? ??????*/?? ??????if?(?!this.CheckBrowser?||?this._IsCompatibleBrowser()?)?? ?? ????{?? ??????????//将此时FCK初始值通过转义之后放入这个input?? ?? ????????sHtml?+=?'<input?type="hidden"?id="'?+?this.InstanceName?+?'"?name="'?+?this.InstanceName?+?'"?value="'?+?this._HTMLEncode(?this.Value?)?+?'"?style="display:none"?mce_style="display:none"?/>'?;?? ?? ????????//生成一个隐藏的INPUT来放置this.config中的内容?? ?? ????????sHtml?+=?this._GetConfigHtml()?;?? ?? ????????//生成编辑器的iframe的代码?? ?? ????????sHtml?+=?this._GetIFrameHtml()?;?? ?? ????}?? ??????/**? ??????*?如果用户的浏览器不兼容FCK默认的几种浏览器? ??????*?只能有传统的textarea了? ??????*/?? ??????else?? ?? ????{?? ??????????var?sWidth??=?this.Width.toString().indexOf('%')??>?0???this.Width??:?this.Width??+?'px'?;?? ?? ????????var?sHeight?=?this.Height.toString().indexOf('%')?>?0???this.Height?:?this.Height?+?'px'?;?? ?? ????????sHtml?+=?'<textarea?name="'?+?this.InstanceName?+?? ?? ????????????'"?rows="4"?cols="40"?style="width:'?+?sWidth?+?? ?? ????????????';height:'?+?sHeight?;?? ?? ????????if?(?this.TabIndex?)?? ?? ????????????sHtml?+=?'"?tabindex="'?+?this.TabIndex?;?? ?? ????????sHtml?+=?'">'?+?? ?? ????????????this._HTMLEncode(?this.Value?)?+?? ?? ????????????'<\/textarea>'?;?? ?? ????}?? ??????return?sHtml?;?? ?? }?? ???? ??/**? ??*?用编辑器来替换对应的文本框? ??*/?? ??FCKeditor.prototype.ReplaceTextarea?=?function()?? ?? {?? ??????//如果已经有了?id=THIS.INSTANCENAME___Frame?的标签时,直接返回?? ?? ????if?(?document.getElementById(?this.InstanceName?+?'___Frame'?)?)?? ?? ????????return?;?? ?? ????//当用户的浏览器符合预设的几种浏览器时?? ?? ????if?(?!this.CheckBrowser?||?this._IsCompatibleBrowser()?)?? ?? ????{?? ??????????//?We?must?check?the?elements?firstly?using?the?Id?and?then?the?name.?? ?? ????????//获取id=this.InstanceName的html标签?? ?? ????????var?oTextarea?=?document.getElementById(?this.InstanceName?)?;?? ?? ????????//获取所有name=THIS.instancename的标签?? ?? ????????var?colElementsByName?=?document.getElementsByName(?this.InstanceName?)?;?? ?? ????????var?i?=?0;?? ?? ????????/*? ??????????*?考虑到用户html标签的命名不规范,所以进行以下编历判断?????笔者指的是用户在textarea标签处用了name=this.instancename? ??????????*?在同个页面的其它标签上也用了name=this.instancename? ??????????*/?? ??????????while?(?oTextarea?||?i?==?0?)?? ?? ????????{?? ??????????????//遍历,直到找到name=this.instancename的textarea标签,并赋给oTextarea?? ?? ????????????if?(?oTextarea?&&?oTextarea.tagName.toLowerCase()?==?'textarea'?)?? ?? ????????????????break?;?? ?? ????????????oTextarea?=?colElementsByName[i++]?;?? ??????????}?? ??????????//如果不存在id或者name为this.instancename的标签时,弹出错误框?? ?? ????????if?(?!oTextarea?)?? ?? ????????{?? ??????????????alert(?'Error:?The?TEXTAREA?with?id?or?name?set?to?"'?+?this.InstanceName?+?'"?was?not?found'?)?;?? ?? ????????????return?;?? ?? ????????}?? ??????????/*? ??????????*?确定存在name=this.instancename的textarea标签后,将编辑器的代码赋给它? ??????????*/?? ??????????oTextarea.style.display?=?'none'?;?? ?? ????????//如果页面上对这样的textarea标签定义了tab键的顺序,赋给this.TabIndex待用?? ?? ????????if?(?oTextarea.tabIndex?)?? ?? ????????????this.TabIndex?=?oTextarea.tabIndex?;?? ?? ????????this._InsertHtmlBefore(?this._GetConfigHtml(),?oTextarea?)?;?? ?? ????????this._InsertHtmlBefore(?this._GetIFrameHtml(),?oTextarea?)?;?? ?? ????}?? ??}?? ???? ???? ???? ???? ???? ???? ??/**? ??*?在指定的页面标签前面插入html代码? ??*?@param?{Object}?待插入的html代码? ??*?@param?{Object}?指定的页面标签(对象)? ??*/?? ??FCKeditor.prototype._InsertHtmlBefore?=?function(?html,?element?)?? ?? {?? ??????if?(?element.insertAdjacentHTML?)????//?IE?私有的?insertAdjacentHTML?方法?? ?? ????????element.insertAdjacentHTML(?'beforeBegin',?html?)?;?? ?? ????else????????????????????????????????//?非ie浏览器?? ?? ????{?? ??????????? ??????????var?oRange?=?document.createRange()?;?? ?? ????????oRange.setStartBefore(?element?)?;?? ??????????var?oFragment?=?oRange.createContextualFragment(?html?);?? ?? ????????element.parentNode.insertBefore(?oFragment,?element?)?;?? ??????}?? ??}?? ???? ???? ???? ???? ??/*? ??*?通过编历this.Config[]来生成一个隐藏域,? ??*?例如:? ??*?this.Config['nileader']="1104",this.Config['leaderni']="nichao"……? ??*?那么,sConfig=……?&nileader=1104&leaderni=nichao?……? ??*?当然,最终,sConfig会被encodeURIComponent函数转换成百分比编码?放入隐藏的INPUT中去? ??*/?? ??FCKeditor.prototype._GetConfigHtml?=?function()?? ?? {?? ??????var?sConfig?=?''?;?? ?? ????for?(?var?o?in?this.Config?)?? ?? ????{?? ??????????if?(?sConfig.length?>?0?)?sConfig?+=?'&'?;?? ?? ????????//encodeURIComponent函数转换成百分比编码?? ?? ????????sConfig?+=?encodeURIComponent(?o?)?+?'='?+?encodeURIComponent(?this.Config[o]?)?;?? ?? ????}?? ??????return?'<input?type="hidden"?id="'?+?this.InstanceName?+?'___Config"?value="'?+?sConfig?+?'"?style="display:none"?mce_style="display:none"?/>'?;?? ?? }?? ???? ???? ???? ??/*? ??*?生成iframe的html??这里涉及到src的确定? ??*/?? ??FCKeditor.prototype._GetIFrameHtml?=?function()?? ?? {?? ??????var?sFile?=?'fckeditor.html'?;?? ?? ????//特殊情况 fckedito所在的窗口没有嵌入在浏览器中?? ?? ????try?? ?? ????{?? ??????????if?(?(/fcksource=true/i).test(?window.top.location.search?)?)?? ?? ????????????sFile?=?'fckeditor.original.html'?;?? ?? ????}?? ??????catch?(e)?{?/*?忽略这个异常.?很多时候,fckedito所在的窗口嵌入在浏览器中.?*/?}?? ?? ????/*? ??????*?这里注意的一点:? ??????*?iframe的工作原理:?当iframe处于可编辑状态时,其实编辑的是src所在的页面? ??????*?这里合成一个sLink以放入iframe标签中? ??????*/?? ??????//sLink就是这个事实上的页面了,从fck的根目录开始,例如???sLink=/fckeditor/editor/fckeditor.html?InstanceName=nileader&Toolbar=nileadersbar?? ?? ????var?sLink?=?this.BasePath?+?'editor/'?+?sFile?+?'?InstanceName='?+?encodeURIComponent(?this.InstanceName?)?;?? ?? ????if?(this.ToolbarSet)?? ?? ????????sLink?+=?'&Toolbar='?+?this.ToolbarSet?;?? ?? ????//生成一个真正的编辑iframer的html代码??当然,放入了src=slink?? ?? ????var?html?=?'<iframe?id="'?+?this.InstanceName?+?? ?? ????????'___Frame"?src="'?+?sLink?+?? ?? ????????'"?mce_src="'?+?sLink?+?? ?? ????????'"?width="'?+?this.Width?+?? ?? ????????'"?height="'?+?this.Height?;?? ?? ????//如果设定了使用"Tab"键的遍历顺序,则赋给iframe?? ?? ????if?(?this.TabIndex?)?? ?? ????????html?+=?'"?tabindex="'?+?this.TabIndex?;?? ?? ????html?+=?'"?frameborder="0"?scrolling="no"></iframe>'?;?? ?? ????return?html?;?? ?? }?? ???? ???? ???? ??/*? ??*?检测用户的bowser是否是fck的默认? ??*?这个方法只是fck公司追求oo,无意义? ??*/?? ??FCKeditor.prototype._IsCompatibleBrowser?=?function()?? ?? {?? ??????return?FCKeditor_IsCompatibleBrowser()?;?? ?? }?? ???? ???? ???? ??/**? ??*?抛出错误? ??*?@param?{Object}?errorNumber????错误编号? ??*?@param?{Object}?errorDescription???错误概述? ??*/?? ??FCKeditor.prototype._ThrowError?=?function(?errorNumber,?errorDescription?)?? ?? {?? ??????this.ErrorNumber????????=?errorNumber?;?? ?? ????this.ErrorDescription????=?errorDescription?;?? ?? ????//是否显示提示错误,默为true?? ?? ????if?(?this.DisplayErrors?)?? ?? ????{??????//将错误编号和错误概述打印出来?? ?? ????????document.write(?'<div?style="COLOR:?#ff0000"?mce_style="COLOR:?#ff0000">'?)?;?? ?? ????????document.write(?'[?FCKeditor?Error?'?+?this.ErrorNumber?+?':?'?+?this.ErrorDescription?+?'?]'?)?;?? ?? ????????document.write(?'</div>'?)?;?? ?? ????}?? ??????//OnError是否自定义了错误处理函数,若定义了,由其处理?? ?? ????if?(?typeof(?this.OnError?)?==?'function'?)?? ?? ????????this.OnError(?this,?errorNumber,?errorDescription?)?;?? ?? }?? ???? ???? ??/**? ??*?转义文本? ??*?@param?{Object}?text???待转义的文本? ??*?@return?String??text????转义完后的文本? ??*/?? ??FCKeditor.prototype._HTMLEncode?=?function(?text?)?? ?? {?? ??????if?(?typeof(?text?)?!=?"string"?)?? ?? ????????text?=?text.toString()?;?? ??????//将字符串中的所有?&?"?<?>?用对应的转义字符代换?? ?? ????text?=?text.replace(?? ??????????/&/g,?"&").replace(?? ?? ????????/"/g,?""").replace(?? ?? ????????/</g,?"<").replace(?? ?? ????????/>/g,?">")?;?? ?? ????return?text?;?? ?? }?? ???? ???? ???? ??;(function()?? ?? {?? ??????//把页面上的textarea元素赋给editor变量?? ?? ????var?textareaToEditor?=?function(?textarea?)?? ?? ????{?? ??????????var?editor?=?new?FCKeditor(?textarea.name?)?;?? ?? ????????editor.Width?=?Math.max(?textarea.offsetWidth,?FCKeditor.MinWidth?)?;?? ??????????editor.Height?=?Math.max(?textarea.offsetHeight,?FCKeditor.MinHeight?)?;?? ??????????return?editor?;?? ?? ????}?? ??????/**? ??????*?Replace?all?<textarea>?elements?available?in?the?document?with?FCKeditor? ??????*?instances.? ??????*? ??????*????//?Replace?all?<textarea>?elements?in?the?page.? ??????*????FCKeditor.ReplaceAllTextareas()?;? ??????*? ??????*????//?Replace?all?<textarea?class="myClassName">?elements?in?the?page.? ??????*????FCKeditor.ReplaceAllTextareas(?'myClassName'?)?;? ??????*? ??????*????//?Selectively?replace?<textarea>?elements,?based?on?custom?assertions.? ??????*????FCKeditor.ReplaceAllTextareas(?function(?textarea,?editor?)? ??????*????????{? ??????*????????????//?Custom?code?to?evaluate?the?replace,?returning?false?if?it? ??????*????????????//?must?not?be?done.? ??????*????????????//?It?also?passes?the?"editor"?parameter,?so?the?developer?can? ??????*????????????//?customize?the?instance.? ??????*????????}?)?;? ??????*/?? ??????FCKeditor.ReplaceAllTextareas?=?function()?? ?? ????{?? ??????????//获取所有的textarea元素?? ?? ????????var?textareas?=?document.getElementsByTagName(?'textarea'?)?;?? ?? ????????? ??????????for?(?var?i?=?0?;?i?<?textareas.length?;?i++?)?? ?? ????????{?? ??????????????var?editor?=?null?;?? ?? ????????????var?textarea?=?textareas[i]?;?? ?? ????????????var?name?=?textarea.name?;?? ?? ????????????//?The?"name"?attribute?must?exist.?? ?? ????????????if?(?!name?||?name.length?==?0?)?? ?? ????????????????continue?;?? ?? ????????????if?(?typeof?arguments[0]?==?'string'?)?? ?? ????????????{?? ??????????????????//?The?textarea?class?name?could?be?passed?as?the?function?? ?? ????????????????//?parameter.?? ?? ????????????????var?classRegex?=?new?RegExp(?'(?:^|?)'?+?arguments[0]?+?'(?:$|?)'?)?;?? ?? ????????????????if?(?!classRegex.test(?textarea.className?)?)?? ?? ????????????????????continue?;?? ?? ????????????}?? ??????????????else?if?(?typeof?arguments[0]?==?'function'?)?? ?? ????????????{?? ??????????????????//?An?assertion?function?could?be?passed?as?the?function?parameter.?? ?? ????????????????//?It?must?explicitly?return?"false"?to?ignore?a?specific?<textarea>.?? ?? ????????????????editor?=?textareaToEditor(?textarea?)?;?? ??????????????????if?(?arguments[0](?textarea,?editor?)?===?false?)?? ?? ????????????????????continue?;?? ?? ????????????}?? ??????????????if?(?!editor?)?? ?? ????????????????editor?=?textareaToEditor(?textarea?)?;?? ??????????????editor.ReplaceTextarea()?;?? ??????????}?? ??????}?? ??})()?;?? ???? ???? ???? ??/**? ??*?检测浏览器的兼容性? ?*?利用了navigator对象返回的一些信息sAgent,判断浏览器??返回包括????浏览器的码名?浏览器名??浏览器版本??语言?等信息?并小写? ?*??例如:? ?*?mozilla/4.0?(compatible;?msie?6.0;?windows?nt?5.2;?sv1;?.net?clr?1.1.4322)? ?*? ?*?判断IE浏览器的时候,运用了IE4.0之后支持的增加了对条件编译,? ?*?由于只是IE支持,在W3C标准浏览器中,该属性是不被支持的。因此,适当的利用该特性,判断IE? ?*/?? ??function?FCKeditor_IsCompatibleBrowser()?? ?? {?? ??????var?sAgent?=?navigator.userAgent.toLowerCase()?;?? ?? ????//?当前浏览器是Internet?Explorer?5.5+?? ?? ????//利用条件编译判断IE?在IE中,/*@cc_on!@*/false?==?!false?==?true,?? ?? ????//如果是非IE浏览器,则忽略,/*@cc_on!@*/false?==?false?? ?? ????if?(?/*@cc_on!@*/false?&&?sAgent.indexOf("mac")?==?-1?)???//不是apple?mac?os?? ?? ????{?? ??????????var?sBrowserVersion?=?navigator.appVersion.match(/MSIE?(.\..)/)[1]?;?? ?? ????????return?(?sBrowserVersion?>=?5.5?)?;?? ?? ????}?? ???? ??????//?Gecko?(Opera?9?tries?to?behave?like?Gecko?at?this?point).?? ?? ????//检测是否是OPERA?9?浏览器?? ?? ????if?(?navigator.product?==?"Gecko"?&&?navigator.productSub?>=?20030210?&&?!(?typeof(opera)?==?'object'?&&?opera.postError?)?)?? ?? ????????return?true?;?? ?? ????//?Opera?9.50+?? ?? ????if?(?window.opera?&&?window.opera.version?&&?parseFloat(?window.opera.version()?)?>=?9.5?)?? ?? ????????color: #7f0055