版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)
文檔簡介
FckEditor配置手冊中文教程詳細(xì)說明
性能
首先,FCKEDITOR的性能是非常好的，用戶只需很少的時間就可以載入FCKEDITOR所需文件.
對于其他在線編輯器來說,這幾乎是個很難解決的難題，因?yàn)樵陂_啟編輯器時需要裝載太多
的文件.比如CUTEEDITOR,雖然功能比FCKEDITOR還要強(qiáng)大，可是，它本身也夠龐大了，至于
FREETEXTBOX等，其易用性及FCKEDITOR相比，尚有差距，可以說FCKEDITOR是一個別具匠心
的在線編輯器,它里面融入了作者高深的面向?qū)ο蟮腏AVASCRIPT功力,集易用性及強(qiáng)大的功
能及一體.
.及編輯器相關(guān)的所有圖像,腳本以及調(diào)用頁
.語言文件
.編輯器的皮膚文件
.工具樣的貼圖等
這些將導(dǎo)致在服務(wù)器和客戶端間產(chǎn)生相當(dāng)?shù)牧髁?如果有許多文件被調(diào)用，那么即便每個文
件很小.也會讓用戶等得不耐煩.
裝載順序
從2.0版開始,編輯器按以下步驟裝載資源：
.基本頁（就是編輯器所在頁）以及裝入編輯器的JS腳本
.用來建立編輯器的腳本
.編輯器的語言和皮膚.
.建立編輯器.
.載入預(yù)置的編輯文檔內(nèi)容.
.從現(xiàn)在開始，用戶可以閱讀和編輯文檔了，不過，拖拽支持以及工具欄都是不可用的
.載入編輯器引擎腳本
.建立工具欄,并且可用
.從現(xiàn)在開始,編輯器的所有功能都已經(jīng)完整
.載入工具欄圖標(biāo)
腳本壓縮
在打包任何新版本時,編輯器的JS腳本將會進(jìn)行預(yù)處理.預(yù)處理步驟如卜.：
.移除所有代碼注釋
.移除所有無用的空白字符.
.將腳本合并成幾個文件
使用上面的方法,我們可以將腳本文件的大小壓縮到原來的50%.
壓縮后，原始的代碼仍然存在于一個名為.Source的文件夾中
如何打包？
編輯器已經(jīng)自帶工打包程序.它位于FCKEDITOR的根文件夾中—PACKAGER文件夾中.名為
Fckeditor.Packager,exe,將其復(fù)制到FCKEDITOR根文件夾中并運(yùn)行，即可自動將JS腳本打
包并壓縮
需要注意的是該程序是一個.bET程序，必須安裝.NETFRAMEWORK才能使用
想要獲取支持？
如果你捐贈15000歐元,你就可以獲得1年的免費(fèi)技術(shù)支持(比較貨的說,相當(dāng)于人民幣
15萬,不過西歐的費(fèi)用相當(dāng)驚人)
如何安裝？
1.下載最新版的FCKEDITOR
2.解壓縮到你的站點(diǎn)根文件夾中名為FCKEDITOR的文件夾中(名稱必須為FCKEDITOR,因?yàn)榕?/p>
置文件中已經(jīng)使用此名稱來標(biāo)示出FCKEDITOR的位置)
3.現(xiàn)在，編輯器就可以使用了，如果想要查看演示，可以按下面方法訪問：
http://<your-site>/FCKeditor/_samples/default.html
注意:你可以將FCKEDITOR放置到任何文件夾,默認(rèn)情況除將其放入到FCKEDITOR文件夾是
最為簡單的方法.如果你放入的文件夾使用別的名稱，請修改配置.文件夾中編輯器BasePath
參數(shù),如下所示：
oFckcditor.BascPath=*/Componcnts/fckedilor/”;
另外,FCKEDITOR文件夾中所有以下劃線開頭的文件夾及文件,都是可選的，可以安全的從你
的發(fā)布中刪除.它們并不是編輯器運(yùn)行時必需的
如何將FCKEDITOR整合進(jìn)我的頁面？
由丁書前的版本提供的FCKEDITOR僅提供了JAVASCRIPT式的整合，因此這里僅講述如何應(yīng)
用JAVASCRIPT來整合FCKEDITOR到站點(diǎn)中，當(dāng)然，其他各種語言的整合，你可以參考.samples
文件夾中的例子束完成
L假如編輯器已經(jīng)安裝在你的站點(diǎn)的/FCKEDITOR/文件夾下.那么，第一步我們需要做的就是
在頁面的HEAD段中放入SCRIPT標(biāo)記以引入JAVASCRIPT整合模塊.例如：
<scripttype="text/javascript“src=w/fckeditor/fckeditor.jsw></script>
其中路徑是可更改的
2,現(xiàn)在,FCKEDITOR類已經(jīng)可以使用了.有兩個方法在頁面中建立一個FCKEDITOR編輯器：
方法1：內(nèi)聯(lián)方式(建議使用)：在頁面的FORM標(biāo)記內(nèi)需要插入編輯器的地方置入以下代碼：
scripttype=*text/javascript"，>
varoFCKeditor=newFCKedilor('FCKeditori');
oFCKeditor.Create();
</script>
方法2:TEXTAREA標(biāo)記替換法(不建議使用)：在頁而的ONLOAD事件中，添加以卜代碼以替換一
個已經(jīng)存在的TEXTAREA標(biāo)記
<html>
<head>
<scripttype="text/javascript”>
window,onload=function()
(
varoFCKeditor=newFCKeditor('MyTextarea');
oFCKeditor.ReplaceTextareaO:
}
</script>
</head>
<body>
<textareaid="MyTextarea"name="MyTextarea”>Thisis<b>the</b>initial
value.</tcxtarca>
</body>
</html>
3.現(xiàn)在，編輯器可以使用了
ECKEDITOR類參考:
下面是用來在頁面中建立編輯器的FCKEDITOR類的說明
構(gòu)造器：
FCKeditor(instanceName[,width,height,loolbarSet,value])
instanceName:編輯器的唯?名稱(相當(dāng)于ID)
WIDTH：寬度
HEIGHT:高度
toolbarSet:T具條集合的名稱
value:編輯器初始化內(nèi)容
屬性：
instanceName:編輯器實(shí)例名
width:寬度，默認(rèn)值為100%
height:高度，默認(rèn)值是200
ToolbarSet:工具集名稱，參考ECKC0NE1G.JS,默認(rèn)值是Default
value:初始化編輯器的HTML代碼，默認(rèn)值為空
BasePath:編輯器的基路徑，默認(rèn)為/Fckeditor/文件夾，注意，盡量不要使用相對路徑.最好
能用相對丁?站點(diǎn)根路徑的表示方法,要以/結(jié)尾
CheckBrowser:是否在顯示編輯器前檢查瀏覽器兼容性，默認(rèn)為true
DisplayErrors:是否顯示提示錯誤,默為true;
集合：
Config[Key]=value;
這個集合用于更改配置中某一項(xiàng)的值，如
oFckeditor.Config["Defaul(Language']="pLbr";
方法：
Create()
建立并輸出編輯器
RepaceTextArea(TextAreaNaire)
用編輯器來替換對應(yīng)的文本框
如何配置FCKEDITOR?
FCKEDITOR提供了一套用于定制其外觀，特性及行為的設(shè)置集.主配置文件名為
Fckconfig.js
你既可以編輯主配置文件，也可以自己定義單獨(dú)的配置文件.配置文件使用JAVASCRIPT語
法.
ShowBordcrs=truc/falsc合并邊框
SkinPath=-皮膚文件夾位置
SmileyColumns=12圖符窗列數(shù)
符數(shù)組圖符窗中圖片文件名數(shù)組
SmileyPath="圖符文件夾路徑
SmileyWindowHeight圖符窗口高度
SmilcyWindowWidlh圖符窗口寬度
SpellChecker="，ieSpell/Spellerpages/r設(shè)置拼寫檢查器
StartupEocus=true/false開啟時FOCUS到編輯器
SlylesXmlPalh/"設(shè)置定義CSS樣式列表的XML文件的位置
TabSpaces=4TAB鍵產(chǎn)生的空格字符數(shù)
ToolBarCanCollapse=true/false是否允許展開/折費(fèi)工具欄
ToolbarSets=object允許使用TOOLBAR集合
ToolbarStartExpanded=true/false開啟是TOOLBAR是否展開
LseBROnCarriageReturn=true/false當(dāng)回車時是產(chǎn)生BR標(biāo)記還是P或者DIV標(biāo)記
如何自定義樣式列表呢？
FCKEDITOR的樣式工具欄中提供了預(yù)定義的樣式,樣式是通過XML文件定義的,默認(rèn)的XML樣
式文件存在于FCkEditor根文件夾下的FckStyls.xml文件中
這個XML文件的結(jié)構(gòu)分析如下：
<?xmlversion=*l.0*encoding="utf-8”?>
<Stylcs>
<Stylename="MyImage*element=*imgw>
<Attributename=*style*value="padding:5px"/>
<Attributename="border“value=*2*/>
</Style>
<Stylename=*Italic*element=/，em*/>
<Stylename="Title“element=*span*>
<Attributename="class"value="Title”/>
</Style>
<Stylename="TitleH3"elcment="h3”/>
</Styles>
每一個STYLE標(biāo)記定義一種樣式,NAME是顯示在F拉列表中的樣式名，ELEMENT屬性指定此樣
式所適用的時象，因?yàn)镕CKEDITOR中的樣式是上下文敏感的，也就是說，選擇不同的對象，僅
會顯示針對這類對象定義的樣式
拼寫檢查
FCKEDITOR帶「兩種拼寫松杳工具.一種是ieSpell.默認(rèn)情況下使用這和L使用這種方式的
拼寫檢查,要求客戶下載并安裝iespell這個小軟件，另外，也提供SpellPager的方式來進(jìn)行
拼寫檢查，不過，由于SPELLPAGER是由PHP編寫的服務(wù)器端腳木，因此要求你的WEB服務(wù)器
必須支持PHP腳本語言方可
更改拼寫檢查器的方式請參見有關(guān)配置文件的詳細(xì)說明
壓縮腳本
為了提供腳本載入的效率,FCKEDITOR采用以下方法對腳本盡量壓縮以減少腳本尺寸：
],移除掉腳本中的注釋
2,移除掉腳本中所有無意義的空白
另外,FCKEDITOR還提供了一個專門用于壓縮腳本的工具以便你在發(fā)布時能減小文件尺寸，
你可以將.Packager文件夾中的Eckeditor.Packager.exe復(fù)制到ECKEDITOR根文件夾來運(yùn)
行并壓縮腳本
本地化ECKEDITOR
如果FCKEDITOR沒有提供您所需要的語言(實(shí)際上全有了)，你也可以自行制作新的語言
，你只需要復(fù)制出EN.JS,然后在其基礎(chǔ)上進(jìn)行翻譯.另外,語言名稱及對應(yīng)的腳本文件名必
須遵循RFC3066標(biāo)準(zhǔn)，但是，需要小寫，例如:PortuguessLanguage對應(yīng)的腳本文件名必須
為pt.js
如果需要針對某個國家的某種語系,則可以在語系縮寫后加上橫線及國家縮寫即可
在使用時，系統(tǒng)會自動偵測客戶端語系及國別而運(yùn)用適當(dāng)?shù)慕缑嬲Z言.
當(dāng)建立一種新的語言后，你必須在"Edit/lang/fcklanguagemarager.js”中為其建立一個條
目，如下所示:
FCKLanguageManager.AvailableLanguages=
(
en:'English',
pt:'Portuguese'
)
需要提醒的是,文件必須保存為UTF-8格式
如何及服務(wù)器端腳本進(jìn)行交互？
請查看例子以得到相關(guān)內(nèi)容
另外,在ASP.NET中以以下步驟使用
1.把FCKEDITOR添中到工具箱
2.托拽FCKEDITOR控件到頁而
3.為其指定名稱
4.ECKEDITOR類的所有屬性不光可以在代碼中使用，而H.可以作為FCKEDITOR控件的屬性直
接使用，例如，要改變皮膚，可以在UI頁面中指定
SkinPath="/fckeditor/editcr/skins/office20()3"即可，其實(shí)FCKEDITOR的ASP.NET版本可
以做得更好，你可以找到FCKEDITORASP.NET2.1的源文件,然后修改該控件的設(shè)計(jì)一.為其暴
露更多有用的屬性,重新編譯即可
5,POSTBACK后的數(shù)據(jù)，使用FCKEDITOR控件的value屬性獲得
6.由于默認(rèn)狀態(tài)下,ASP.NET不允許提交含有HTML及JAVASCRIPT的內(nèi)容，因此，你必須將使
用FCKEDITOR的頁面的ValidateRequest設(shè)為false.(<%@pagevalidteRequest=*false*%>
即可)
附：
一、如何設(shè)置上傳文件語言
把FCKedilor根目錄下面的fc目on下g.js文件里
var_='asp';//aspaspxIcfmIlasso|perl|phppy
var_QuickUploadLanguage='asp';//asp|aspx|cfm|lassophp
這兩行中改成您所需要調(diào)用的編輯器語言，如用asp.net則改為aspx；
二、解決中文的問題：
在web.config中加入：
<globalizationrequcsiEnccding="GB2312"rcsponscEncoding="GB2312”/>
這樣設(shè)置后可以顯示中文的文件，但URL地址也是中文的；
如果服務(wù)器對中文地址的解析不好，可能導(dǎo)致圖片無法瀏覽：
所以修改：cditor\\browscr\dcfault\frniresourccslist.html
中的OpenFile函數(shù)，把
window,top.opener.SetUrl()：
修改為：
window.top.opener.SetUrl(escape());
三.設(shè)置上傳的目錄：
1:在web.config中設(shè)置：
<appSettings>
<addkey=*FCKeditor:User*value=*/fck/UpLoad/*/>
</appSettings>
2:在Session中設(shè)置:
在editor\\browser\default\connectors\aspx\connector.aspx中加入以下代碼：
<scriptrunat=，/server，/language="C*">
protectedoverridevoidOnlnit(EventArgse)
(
Session[*FCKeditor:User*]=*/fck/UpLoadl/*;
)
</script>
如何在asp.net中動態(tài)設(shè)置上傳圖片的路徑？
1.在javascript中修改FCKConfig.ImageBrowserURL的值，修改方式如下：
FCKConfig.ImageBrowserURL+="?Path=要上傳的文件路徑”；
如:要把文件上傳到站點(diǎn)根目錄的UploadFile文件夾中，則設(shè)置為：
FCKConfig.ImageBrowserURL+=，z?Path=/UploadFile";
2.在“editor\\browser\default\connectors\aspx\connector.aspx”文件最后中增加以下
程序：
<scriptrunat="server"languagc="C#">
protectedoverridevoidOnlnit(EventArgse)
(
if(Request.QueryString[z，F(xiàn)ath*]==null){
Session[*FCKeditor:User*]="/UpLoadFiles/”;〃設(shè)置默認(rèn)值
}else(
Session["FCKedilor:User=Request.QucrySlring["Palh"：;
)
)
</script>
多環(huán)境下的配置和使用技巧
在fekeditor中添加右鍵菜單
現(xiàn)在網(wǎng)上介紹FCKEditor如何配置,如何精簡的例子非常之多,如有需要可以google一下,
此處不必贅述?，F(xiàn)在介紹一下，如何自定義此編輯器，暫包括如何添加工具條上的item,
產(chǎn)生響應(yīng)，添加右鍵菜單。IISEEMSVERYEASY!
閑言少敘，書歸正傳。
一、自定義右鍵菜單：
1.首先，在editor/]ang/zh-cn.js里添加你所要添加的工具條item的名字，此文件
定義了一個FCKLang變量，仿照里邊的格式寫哦，如:First:‘第一"，注意，如果是不在倒
數(shù)第二行(倒數(shù)第一行是“}”)，后邊的這個逗號是一定要有的，不然網(wǎng)頁中不會出現(xiàn)編輯
器，筆者曾經(jīng)犯過如此低級的錯誤，待醒悟后，找一僻靜之所大嘴巴子招呼;呵呵，我們是
中國人，自然在冒號后對應(yīng)漢語，這也是將來在網(wǎng)頁中顯示的內(nèi)容。
2.之后，在editor/scurce/internals/fckconunands.js里新建一個command:case
'First':oCommand=newFCKFirstCommand('First',FCKl.ang.First);break注意那
個紅色字體的FCKFirstCommand了么？這個是一個自定義的conwand,稍候?qū)⒂懻撍?/p>
3.然后，在editor/source/internals/fckcontextmenu.js添加一個context
menu。在case'Generic':下面添加如下：eGroup.Add(new面添ontextMenuItem(this,
'First'.FCKLang.First,true)):其中第四個布爾類型的參數(shù),如果指定為true,說
明菜單有圖標(biāo)，反之則無。在比，我指明了我所自定義的菜單是有圖標(biāo)的，那么我就應(yīng)該把
圖標(biāo)放在editor\skins\xxx\toolbar目錄下，其中xxx就是你在你的配置文件里選擇的編
輯器的皮膚，但是我們的圖標(biāo)命名可是有學(xué)問的，必須是如FCKContextMenuItem構(gòu)造函數(shù)
(且這么叫它)第二個字符串參數(shù)的小寫字母形式，如，這里我的圖標(biāo)被命名為first.gif
了。0k,如此右鍵菜單就被添加上去了，運(yùn)行你的網(wǎng)頁，看看FCKEditor是否奏效?如果不
奏效的話就要重新參考此文嘍.。
4.然后，還有最關(guān)鍵的一步:用editor下的fckeditor.original.html網(wǎng)頁的內(nèi)容代替
fckeditor.html的內(nèi)容，同時不要忘記備份fckeditor.html叉件！
5、現(xiàn)在開始討論步驟2中的FCKFirslCommand。菜單添加上其了，你總得讓丫擁有什
么功能吧？好，在editor/source/commandclasses/fckothercommands.js里新建這個類：
四大ECKeditor實(shí)戰(zhàn)應(yīng)用技巧
一般建立好類后，還要建立兩個靜態(tài)函數(shù):xxx.prototype.Execute,
xxx.prototype.GetState。前者是事件處理函數(shù)，即點(diǎn)擊了該右健菜單所要執(zhí)行的功能全
部寫在這個函數(shù)，后者返回菜單的狀態(tài)(可用？不可用？)。在此為了演示，我們實(shí)現(xiàn)一個最簡
單的功能：FCKPageCommand.prototype.Execute=function(){window,alert(z，It
works!");}夠簡單吧，只是不疼不癢的彈出一個提示框。當(dāng)然，這里我們也可以不用自定
義的FCKFirs(Command,而直接用FCKEditor定義好的command,比如FCKDialogCommand,
它也定義在fckothercommands.js里，當(dāng)然如果這樣的話，彈出的會是一個dialog。再
次運(yùn)行網(wǎng)頁，右擊，點(diǎn)擊你的自定義菜單，是否彈出提示框呢。
尸0^^”至今已經(jīng)到了2.3.1版本了,對于國內(nèi)的WEB開發(fā)者來說,也基本上都已經(jīng)“聞
風(fēng)知多少”了，很多人將其融放到自己的項(xiàng)目中，更有很多大型的網(wǎng)站從中吃到了甜頭。今
天開始，我將一點(diǎn)點(diǎn)的介紹自己在使用FCKcditor過程中總結(jié)的一些技巧，當(dāng)然這些其實(shí)
是PCK本來就有的，只是很多人用FCK的時候沒發(fā)現(xiàn)而已：P
1.適時打開編輯器
很多時候，我們在打開頁面的時候不需要直接打開編輯器，而在用到的時候才打開，
這樣一來有很好的用戶體驗(yàn)，另一方面可以消除FCK在加載時對頁面打開速度的影響，如
圖所示
點(diǎn)擊“OpenEditor”按鈕后才打開編輯器界面
實(shí)現(xiàn)原理：使用JAVASCRIPT版的FCK,在頁面加載時(未打開FCK),創(chuàng)建一個隱藏的
TextArea域，這個TextArea的name和ID要和創(chuàng)建的FCK實(shí)列名稱,致，然后點(diǎn)擊“Open
Editor”按鈕時.通過調(diào)用一段函數(shù)，使用FCK的ReplaceTextarea。方法來創(chuàng)拉FCKeditor.
代碼如下
<scripttype=z，text/javascript*>
<!~
functionshowFCK(){
varoFCKcditor=newFCKcditor(TfbContent*);
oFCKeditor.BasePath=*/FCKeditor/*;
oFCKeditor.ToolbarSet='Easic';
oFCKeditor.Width=(100%*;
oFCKeditor.Height=*200*;
oFCKeditor.ReplaceTextareaO;
)
//->
</script>
<textareaname=fbContentid=*fbContent*><textarea>
2.使用FCKedilor的API
FCKeditor編輯器，提供了非常豐富的API,用于給EndUser實(shí)現(xiàn)很多想要定制的功能,
比如最基本的數(shù)據(jù)驗(yàn)證，如何在提交的時候用JS判斷當(dāng)前編輯器區(qū)域內(nèi)是否有內(nèi)容，F(xiàn)CK
的API提供了GetLengthO方法；
再比如如何通過腳本向FCK里插入內(nèi)容，使用InscrlHTMLO等：
還有，在用戶定制功能時，中間步驟可能要執(zhí)行FCK的一些內(nèi)嵌操作，那就用
ExccutcCommand()方法。
詳細(xì)的API列表，請杳看FCKeditor的Wiki。而常用的API,請查看FCK壓縮包里的
samples/html/sample08.htirl.此處就不貼代碼了。
3.外聯(lián)編輯條(多個編輯域共用一個編輯條)
這個功能是2.3版本才開始提供的，以前版本的FCKeditor要在同一個頁面里用多個編
輯器的話，得一個個創(chuàng)建，現(xiàn)在有了這個外聯(lián)功能，就不用那么麻煩了，只需耍把工具條
放在一個適當(dāng)?shù)奈恢茫蠖涂梢詿o限制的創(chuàng)建編輯域了，如圖：
要實(shí)現(xiàn)這種功能呢，需要先在頁面中定義一個工具條的容器：
<divid="xToolbar"X/div》,然后再根據(jù)這個容器的id屬性進(jìn)行設(shè)置。
ASP實(shí)現(xiàn)代碼：<divid=*fckToolBar，r></div>
<%
DimoFCKeditor
SetoFCKeditor=NewFCKeditor
withoFCKeditor
.BasePath=fckPath
.Config("ToolbarLocation")="Out:fckToolBar”
.ToolbarSet="Basic”
.Width="100%”
.Height="200"
.Value=
.Create“jconlcnl”
.Height="150"
.Value=""
.Create"jreach”
endwith
%>
JAVASCRIPT實(shí)現(xiàn)代碼：<divid=*xToolbar*X/div>
FCKeditor1:
<scripttype=*text/javascript*>
<!—
/.Automatical!,calculate,th.edito.bas.pat.base.o.th.sample,directory.
/.Thi.i.useful,onl.fo.thes.samples..rea.applicatio.shoul.us.somethin,lik.this.
/.oECKeditor.BasePat..'/fekeditor/../.*/fekeditor/.i.th.dcfaul.value.
varsBasePath：
document,location,pathname.substring(0,document,location,pathname.lastlndexOf(,
—Samples'));
varoECKeditor=ne譚l；CKeditor('FCKeditor」')：
oFCKeditor.BasePath=sBasePath;
oFCKeditor.Height=100;
oFCKeditor.ConfigEJToolbarLocation']=1Out:parent(x^oolbar)1;
oFCKeditor.Valu..'Thi.i.scm.<strong>sampl.text</strong>.Yo.ar.usin.FCKeditor...
oFCKeditor.Create();
//->
</script>
<br/>
FCKeditor2:
<scripttype=wtext/javascript*>
<!"
oFCKeditor=newFCKeditor('FCKeditor_2'):
oFCKeditor.BasePath=sBasePath;
oFCKeditor.Height=100;
oFCKeditor.Config[*ToolbarLocation*]=1Out:parent(xToolbar)*;
oFCKeditor.Valu..'Thi.i.scm.<strong>sampl.text</strong>.Yo.ar.usin.FCKeditor...
oFCKeditor.Create();
//->
</script>
此部分的詳細(xì)DEMO請參照：
_samples/html/samplell.htirl
^samplcs/html/samplell_frame.hlml
4.文件管理功能、文件上傳的權(quán)限問題
一宜以后FCKeditor的文件管理部分的安全是個值得注意，但很多人沒注意到的地方,
雖然ECKeditor在各個Release版本中一直存在的一個功能就是對上傳文件類型進(jìn)行過濾,
但是她沒考慮過另一個問題：到底允許誰能上傳？到底誰能瀏覽服務(wù)器文件？
之前剛開始用FCKeditor時，我就出現(xiàn)過這個問題，還好NetRube（FCKeditor中文化
以及FCKcdilorASP版上傳程序的作者）及時提醒了我，做法是去修改FCK上傳程序，在里
面進(jìn)行權(quán)限判斷，并且再在fckconfig.js里把相應(yīng)的一些功能去掉。但隨之FCK版本的不
斷升級，每升一次都要去改一次配置程序fckconfig.js,我發(fā)覺厭煩了，就沒什么辦法能
更好的控制這種配置么？事實(shí)上，是有的。
在fckconfig.js里面，有關(guān)丁?是否打開上傳和瀏覽服務(wù)器的設(shè)置，在創(chuàng)建FCKeditor
時，通過程序來判斷是否創(chuàng)建有上傳瀏覽功能的編輯器。首先，我先在fckconfig.js里而
把所有的上傳和瀏覽設(shè)置全設(shè)為false,接著我使用的代碼如下：
ASP版本：＜%
DimoFCKeditor
SetoECKeditor=NewECKeditor
withoFCKeditor
.BasePath=fckPath
.Config(*ToolbarLocation*)=*Out:fckToolBar*
ifrequest,cookies(sitesn)("issuper")="yes"then
.Config("LinkBrowser")="true"
.Config("ImageBrowser")="true"
.Config(*FlashBrowser*)="true"
.Config(^LinkUploadw)="true"
.Config(*ImageUpload*)="true"
.Config(*FlashUpload*)="true"
endif
.ToolbarSet="Basic”
.Width="100曠
.Height="200"
.Value=""
.Create“jeontent”
%〉
JAVASCRIPT版本:varoFCKeditor=newECKeditor(,fbContent,);
<%ifpower=powercodethcn%>
oFCKeditor.Config[,LinkBrcwser，]=true;
oFCKeditor.ConfigfImageBrowser,]=true;
oFCKeditor.ConfigFlashBrowscr，]=true;
oFCKeditor.ConfigfLinkllpload*]=true;
oFCKeditor.ConfigfImageUpload)]=true;
oFCKcdilor.Config[*FlashUpload，]=true;
<%endif%>
oFCKeditor.ToolbarSet=1Basic,;
oFCKeditor.Width=*100%,;
oFCKeditor.Height='200';
oFCKeditor.Value=：
oFCKeditor.Create();
ECKPageCommand.prototype.Execute=function()
(
window,alert("Itworks!”);
}
FCKeditor在ASP環(huán)境中配置使用
先說一下我的測試環(huán)境：XPSF2,IIS5.1,FCKeditor2.0
在HS上建立一個新的站點(diǎn)，我直接取名為FCKeditor
在DW里建立一個相對應(yīng)的站點(diǎn)，測試服務(wù)器為本機(jī)，支持VBScripl
下載FCKeditor2.(),這個東西是開源的，網(wǎng)上能下到的地方很多，自己找去……
卜.載卜.來的應(yīng)該是壓縮包，解壓到FCKeditor站點(diǎn)根目錄，什么都不需要更改，直接就可
以開始調(diào)用了。等你會了的時候，會發(fā)現(xiàn)簡單得要死去！
在站點(diǎn)根目錄下，新建一個index,asp頁面，＜body＞段內(nèi)加如下代碼(調(diào)用編輯器)：
＜%
DimoFCKeditor
SetoFCKeditor=NewFCKeditor
oFCKcditor.BasePath="FCKcdiior/"〃設(shè)置編輯器的路徑，我站點(diǎn)根目錄下的一個目錄
oFCKeditor.ToolbarSet="default”
oFCKeditor.Width="100%”
oFCKcditor.Height="600"
oFCKeditor.Value=""〃這個是給編輯器初始值
oFCKcditor.Create"logbody"〃以后編輯器里的內(nèi)容都是由這個logbody取得，命名由你
定
%>
加了這一段別忘了在index,asp前面第二行加上
<!-#includefile=，，F(xiàn)CKeditor/fckeditor.aspz，—>
把fckedilor.asp包含進(jìn)來。切記切記!
就這么簡單！
現(xiàn)在你只要把這個編洱懦當(dāng)成一個控件束使用，提取它的數(shù)據(jù)可用：request("logbody")
現(xiàn)在松口氣吧。測試成功了。里而有些設(shè)置，去網(wǎng)上找些高級的使用說明來看吧。
FCKeditor使用初步
作者：檸檬園主
FCKeditor2.0版終于出來了，之所以用“終于”這個詞，是因?yàn)樵谶@一版本上加上了
眾望所歸的FLASH插入功能?？梢哉f在所有的在線編輯器中，F(xiàn)CKeditor是目前互聯(lián)網(wǎng)上最
好的編輯器，功能強(qiáng)大，支持多種瀏覽器，無平臺限制，可以和多種WEB語言融合，多語
言支持，開源等~~
對了一個全新的網(wǎng)站，F(xiàn)CKeditor就可以直接拿過來用了，不需要進(jìn)行什么修改。但是
對于絕大多數(shù)的已有網(wǎng)站而言，F(xiàn)CKcdilor的一些設(shè)置并不適合自己的使用，這篇.文章旨在
告訴你簡單的修改FCKeditor以方便您的網(wǎng)站的使用。
第一項(xiàng)工作就是對這個功能宏大的編輯器進(jìn)行精簡，當(dāng)然是文件精簡而非功能精簡化。
在這里我以asp版的FCKeditor為例進(jìn)行,進(jìn)入到FCKeditor2.0文件夾下,先把以
為開頭的文件夾統(tǒng)統(tǒng)刪除,這些文件夾里放的是范例或是一些其它工具。其實(shí)也就是只保留
editor文件夾、fckconfig.jsfckeditor.aspfckeditor.jsfckstyles.xml
fcktemplates.xm］就可以了，最外層的精簡化完畢，進(jìn)入到editor文件夾內(nèi)，先把
“.source”文件夾刪除，這里是一些源文件，對于使用來說沒什么用處。
進(jìn)入images文件夾，刪除smiley文件夾，些文件是放表情圖標(biāo)的，由于接下來我會用
我自己的表情圖標(biāo)，先把他們的刪除，當(dāng)然，如果你想用這里的表情圖標(biāo)那就不要刪掉了。
退出images再進(jìn)入lang文件夾內(nèi)，這里的東西可以來個大清洗了，只保留
fcklanguagemanager.js>zh-cn.js、en.js、zh.js這四個文件，第一個文件是語言配置文
件，有了它才能和fckconfig.js里的設(shè)置成對對應(yīng)上相應(yīng)的語言文件,zh-cn.js是簡體中
文語言包,en.js就不用說了吧，zh.js是繁體中文的。怎么樣？一下子少了幾百K,爽吧~
再退出lang文件夾，進(jìn)入skin文件夾，如果你想使用fckcdilor默認(rèn)的這種奶黃色,
那就把除了default文件夾外的另兩個文件夾直接刪除，如果想用別的，那就自己考慮了，
不過我給你個建議，如果不想用默認(rèn)的，那就選那個silver,因?yàn)殂y色也就是灰色和任何
顏色配起來都不會難看，而那個。ffice2003的皮膚，反正我是非常不喜歡的，并且圖片相
對也比較大，乂增加了下載時間，不要！
精簡的最后一步，退出skin文件夾，再進(jìn)入，如果你用的不是最新版的fckcdilor的
話，那這里就一個文件夾broivser,新版的還有一個upload文件夾。一個個來，先進(jìn)入到
下，因?yàn)槲沂怯玫腶sp的，所以除asp文件夾外，全部刪除。然后再進(jìn)入下，同樣，只留
asp文件夾，至此，編輯器的精簡化已經(jīng)結(jié)束了，接下來，我們對編輯器進(jìn)行設(shè)置修改。
第一個修改的文件，也就是fckeditor總配置文件，位于根目錄下的fckconfig.js文
件。請根據(jù)下面的列表進(jìn)行（以fckcdiior2.0版的為準(zhǔn)）：
找到第20行ECKConfig.DefaultLanguage='en';改為ECKConfig.DefaultLanguage=
'zh-cn';設(shè)置默認(rèn)語言為簡體中文
找到第40行FCKConfig.TabSpaces=0;改為FCKConfig.TabSpaces=1;即在編輯器
域內(nèi)可以使用Tab鍵。
如果你的編輯器還用在網(wǎng)站前臺的話，比如說用于留言本或是日記回復(fù)時，那就不得不考
慮安全了，在前臺千萬不要使用Default的toolbar,要么自定義一下功能，要么就用系統(tǒng)
已經(jīng)定義好的Basic,也就是基本的toolbar,
找到第64行FCKConfig.ToolbarSets["Basic”]=[
['Bold'Italic''OrderedList*,*UnorderedList1,*,，/*'Link',*/'Unlink',
'Style*,*FontSize','TextCclor*,'BGColor,'Smiley','SpecialChar','Replace','
Preview*]
]；
這是我改過的Basic,把圖像功能去掉，把添加鏈接功能去掉，因?yàn)閳D像和鏈接和門ash和
圖像按鈕添加功能都能讓前合頁直接訪問和上傳文件，要是這兒不改宜接給你上傳個木馬
還不馬上玩完？但是光這樣還不行，fckeditor還支持編輯域內(nèi)的鼠標(biāo)右鍵功能。
找到第73行
FCKConfig.ContextMenu=
「'Generic*,/*'Link',*/'Anchor*,/*'Image'.*/'Flash','Select5.'Textarea','Checkbo
x','Radio',,TextField*,*HiddenField',/**ImageBulton，,*/'Button','BulletedList,,
'NumberedList',*TableCelT,*Table','Form'];
這也是我改過的把鼠標(biāo)右鍵的“鏈接、圖像，F(xiàn)LASH,圖像按鈕”功能都去掉。
找到第77行FCKConfig.FontNames-,Arial;ComicSansMS;CourierNew;Tahoma;Times
NewRoman;Verdana';
加上幾種我們常用的字體FCKConfig.FontNames='宋體；黑體；隸書；楷體
GB23⑵Arial;ComicSansMS;CourierNew;Tahoma;TimesNewRoman;Verdana';
接下來就設(shè)置上傳功能了，還是以ASP為例，其實(shí)fck默認(rèn)的就是asp的，把100行以
下的所有被注釋掉的代碼全部刪掉就行，然后再把下面所有有關(guān)于browser,html和
upload,asp的后面的?Type=XK都改成Type=YY,其中YY為你想保存文件的文件夾名稱。
而如果你還想用自己的表情圖標(biāo)的話，那跳到131行，改掉那個表情圖標(biāo)的文件夾地
址，以及下面的表情圖標(biāo)的文件名，再下面那三個數(shù)字是每行顯示表情數(shù)及彈出窗口的寬
和高了，這個的大小要根據(jù)您的表情圖標(biāo)排列的窗口的大小而定了。0K,總配置文件修改結(jié)
束。
接下來是編輯器位置的設(shè)置，我的習(xí)慣是把editor放在根目錄下，最開始所述的五個
文件也放在根目錄下（Tips:建議放在根目錄下，并且建議使用時設(shè)置路徑也采用絕對路徑,
如“/fckeditor/",而我的習(xí)慣的設(shè)置是"/"），這樣有利于fckeditor的更新升級，并且網(wǎng)
站下所有文件夾都可以任意調(diào)用，不存在其它文件夾名變了而其它地方就無法使用編輯器
的問題。
打開fckeditor.asp文件,找到sBasePath="/fckeditor/"改為sBasePath="/"
打開fckeditor.js文件，找到this.BasePath='/fckeditor/';改為this.BasePath
編輯器域內(nèi)默認(rèn)的顯示字體為12px,而我的主頁默認(rèn)字體為14px,所以看著就很不舒
服，想要修改可以通過修改樣式表來達(dá)到要求，1JJf/editor/css/fck_editorarea.css,
把第4行改為font-size:14px;即可。
接下來就是上傳文件的設(shè)置了，這個比較麻煩，請仔細(xì)操作。
打開\editor\\browser\default\frmresourcetype.htm.,找到第15行，插入
“uploadfile','uploadfile'配合上剛才在fckconfig.js里的設(shè)置,那么我的上傳
文件路徑就是/uploadfile,當(dāng)然你也可以改成你想要的文件夾，但這里的名稱一定要和
fckconfig.js里的那個“Type=YY”里的YY一致才行。
還沒完，維續(xù)進(jìn)入到editor\\browser\default\connectors\asp,打開config,asp,
先把ConfiglsEnabled=False改成為ConfiglsEnabled=True,要不是沒法上傳文件的,
再把ConfigUser="/UserFile"改成我想要的ConfigL'ser="/"。
接著在“SetConfigDeniedExtensions=CreateObject("Scripting.Dietionary")'
后面加入ConfigAllowcdExlensions.Add"uploadfile",""
ConfigDeniedExtensions./\dd"uploadfile",
同理，這里的設(shè)置也是要和上面以及fckconfig.js里面對應(yīng)的。
還有一個上傳，就是快速上傳，這個功能是在fckcdiior2.0里才有的，以前的版本沒
這個功能。進(jìn)入\editor\\upload\asp,同樣打開config.asp,也同樣的把
ConfiglsEnabled=False設(shè)置成ConfiglsEnabled=True,我這里把ConfigUser=
"UserFiles/"改成我想要的ConfigUser="/uploadfile/"&Year(DaleO)
Month(Date())因?yàn)槲业纳蟼魑募欠旁趗ploadfile文件夾下，并且是按月分開放
置的?？焖偕蟼?，不會讓你選擇文件夾，而是通過這里的設(shè)置直接上傳的，這兒設(shè)置如果和
前而的設(shè)置配合不好的話，你的文件就會被上傳得亂七八糟，眼不方便管理。接前重復(fù)前一
個config.asp里的操作，在后面加上
ConfigAllowedExtensions.Add“uploadfile",
ConfigDenicdExtcnsions.Add*uploadfilc*?””
接下來呢,就講一下如何創(chuàng)建自己的在線編輯器,這里以ASP和JS版的為例,ASP版
示例代碼，一般用于后臺操作：
<%
DimoFCKeditor
SetoFCKeditor=NewFCKeditor
oFCKeditor.BasePath=
oFCKeditor.ToolbarSet="default”
oFCKeditor.Width=*100%*
oFCKeditor.Height="400"
oFCKeditor.Value=rsClogbody*)
oFCKeditor.Create“l(fā)ogbody”
%>
ASP版的，當(dāng)然只能用在以.asp為擴(kuò)展名的頁面中，如果你在前在fckcdilo.asp里設(shè)
置過BasePath為的話，這里就可以省掉第三行，ASP版的只有一個Create函數(shù)。建議
在修改一篇內(nèi)容時用ASP版的。
接下來看JS版的：
<scripttype=*text/javascripl*>
varoFCKeditor=newFCKeditor('logbody');
oFCKeditor.BasePath='/';
oFCKeditor.ToolbarSet='Basic';
oFCKeditor.Width=*100%*:
oFCKeditor.Height=*400*;
oFCKeditor.Value=;
oFCKeditor.Create();
</script>
BasePath的設(shè)置同上所述，JS版的可用于任何網(wǎng)頁中，甚至用于html頁面，因?yàn)槠涫?/p>
客戶端生成的，這樣的好處就是一可以減小網(wǎng)絡(luò)流量，因?yàn)榫庉嬈魑募恍柘螺d一次，二
是可以由客戶端定義什么時候顯示，由于fckeditor初始化需要一定時間，在這一點(diǎn)上JS
就很有作用了。
另外，JS版的還有■個功能函數(shù)就是ReplaceTextareaO函數(shù)，可以替換指定的TextArea,
拿我的網(wǎng)站的日志的回復(fù)部分示例：
<scripttype="text/javascript”>
<!—
functionshowFCKO{
varoFCKeditor=newFCKeditor('fbContent');
oFCKeditor.BasePath='/';
oFCKeditor.ToolbarSct=*Easic,;
oFCKeditor.Width='100%';
oFCKeditor.Height=*200*;
oFCKeditor.Value=;
//oFCKeditor.Create();
oFCKeditor.ReplaceTextareaO:
//document.blog_feedback.blogsubmit.disabled=
document,blogfeedback,blcgsubmit.style,display=;
document.blog_feedback.openECK.disabled='true';
document,blogfeedback.openFCK.style,display=*none*;
}
//->
</script>
把其寫成一個簡單的函數(shù)，當(dāng)用戶顯示打開編輯器時才生.成這個fckeditor,不用每次刷
新頁面都去初始化一個編輯器，頁面的速度就會快多了。
補(bǔ)遺：前面講到了，說是在編輯已有數(shù)據(jù)內(nèi)容時不要用JS版的，那是因?yàn)閱我枺ā┑膯?/p>
題造成的.在數(shù)據(jù)內(nèi)容里難的會有單引號存在而用JS版生成編輯器時可能就會因?yàn)閱我?/p>
問題，而使編輯器無法正常生成，而采用asp則不同，用ASP版本的是因?yàn)閿?shù)據(jù)被當(dāng)成是一
個變量了，然后直接賦值給編輯器域。還有就是除非你要用ReplaceTextAreaO方法來生成
編輯器，否則你不需先寫一個＜textarea＞這樣的標(biāo)簽，一切都會由fckeditor自動生成的，
你所需做的只是給fekedilor指定一個實(shí)例名。同時你也不用擔(dān)心如何提交，在表單提交的
時候，fckeditor會自動提交：提交的變量名是以你指定的fckeditor實(shí)例命名的。
ECKEditor在Asp.net環(huán)境下的配置安裝
不知道大家留意到?jīng)]有了：
EreeTextbox不開源了，雖然我還有它以前的開源版本。
CSDN用的這個在線編輯器很優(yōu)秀。
它的名字叫做FCKEditor
它是開源的
及平分無關(guān)，最起碼能支持Asp,Asp.net,PHP
以前我一宜用FreeTextB:）x（主要是從CommunityServer那里知道的）。但是發(fā)現(xiàn)它并
不是想象中好用，主要是上傳圖片沒有弄好。好了好了，言歸正傳，說說我們今天的主角，
FCKEditor,怎么在Asp.ncl中部署吧。
首先，他的網(wǎng)站下載吧。這里要注意，你要下載兩個ZIP文件，一個是Core,即核心
文件，里而是整個FCKEdilor的核心。第二個是For.ncl的組件。為了描述方便，我將真
實(shí)文件名附上，以后要自己靈活修改啊。
下載的核心文件叫FCKcditor_2.3.1.zip
For.net的文件叫ECKeditor.Net_2.2.zip
部署步驟：
解壓FCKeditor_2.3J.zip,將里面的FCKEditor復(fù)制到你的IIS主目錄里面,其實(shí)要
的效果是能夠這樣訪問到就可以了，將的變量：
,Quickl-ploadLanguage的值改為aspx,不難做吧。
（可選）將復(fù)制好的FCKEditor里的以開頭的文件及文件夾刪除，當(dāng)然如果你是在
開發(fā)也可以不刪除，里面都是示例及調(diào)試頁面。
解壓縮FCKeditor.Net_2.2.zip,然后在VS.net2003中添加新的控件那樣添加，
bin\Rclease\FrcdCK.FCKcdilorV2.dll這個文件，呵呵，以后你就可以隨便拖放這個控件
了。
（重要）將上面的DLL文件復(fù)制到
然后在IIS設(shè)告中讓這個目錄可以運(yùn)行ASDX。同樣.乜要重復(fù)上面的過程。
另外一種更加簡單的方法是將FredCK.FCKeditorV2.dll復(fù)制目錄下，然后在IIS中
創(chuàng)建應(yīng)用程序。
這一步的目的是讓:
這兩個文件能夠工作。
好了，到此為止，你在aspx也里面拖入FCKEditor,將BasePath設(shè)置為/FCKEditor/
就可以用了。
如果：
工作不正常
你在瀏覽服務(wù)器時，就會有XMLRequestError:XXXXXXXXXXXXXX(500)錯誤。
你在上傳圖片時，按鈕怎么按都沒有反應(yīng)的。
在jsp環(huán)境中配置使用ECKEditor
FCKeditor是sourceforge,net上面的?個開源項(xiàng)目,主要是實(shí)現(xiàn)在線網(wǎng)頁編輯㈱的功能,
可以讓web程序擁有如MSA'ord這樣強(qiáng)大的編輯功能。官方網(wǎng)站為，在服務(wù)器端支持
ASP.Net、ASP、ClodFusion.PHP、Java等語言，并且支持IE5+、Mozilla、Netscape等
主流瀏覽器。
首先在官方網(wǎng)站下載fckeditor,注意有兩個包，一個是主文件，一個是jsp整合包的。
1.解壓FCKeditor_2.2.zip,（FCKeditor主文件）,將FCKeditor目錄復(fù)制到網(wǎng)站根目錄
下，
2.解壓ECKeditor-2.3.zip,（jsp,FCKeditor整合包），作用：
Thi.i.th.JS.Integralio.Pac.fo.usin.FCKedito.insid..jav.serve,pag.withou.th.comp
lexit.o.usin..Jav.scriptlet.o.th.javascrip,api.
3.將FCKeditor-2.3/web,'WEB-INF/web.xml中的兩個servlet,servlet-mapping定義復(fù)
制到自己項(xiàng)目的web.xml文件中
修改
<serv1et-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>/editor/</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>SimpleUploader</servlet-name>
<url-pattcrn>/cditor/</url-pattern>
</servlet-mapping>
為
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>/FCKeditor/editor/</url-pattern>
</scrvlet-niapping>
<servlet-mapping>
<servlct-nanie>SimplcUploadcr</scrvlet-name>
<ur1-pattern>/FCKeditor/editor/</url-pattern>
</servlet-mapp
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 玫瑰痤瘡的中醫(yī)內(nèi)服方劑與光電聯(lián)合方案
- 廢水廢氣處理項(xiàng)目可行性分析報告范文
- 三峽集團(tuán)辦公室副主任晉升考試題含答案
- 酒店總經(jīng)理職位面試技巧及問題解析
- 刮板流量計(jì)建設(shè)項(xiàng)目可行性分析報告（總投資16000萬元）
- 旅游行業(yè)崗位面試題庫及答案參考
- 資源循環(huán)各子公司總經(jīng)理管理能力考試題含答案
- 工會工作考核與評價標(biāo)準(zhǔn)
- 促銷專員崗位面試全攻略百威中國面試題集
- 特殊毒物（如甲醇）中毒的凈化方案優(yōu)化
- 判決分析報告
- 潔凈工作臺性能參數(shù)校準(zhǔn)規(guī)范
- 如果歷史是一群喵16
- 華為HCIA存儲H13-611認(rèn)證培訓(xùn)考試題庫（匯總）
- 社會主義發(fā)展史知到章節(jié)答案智慧樹2023年齊魯師范學(xué)院
- 美國史智慧樹知到答案章節(jié)測試2023年東北師范大學(xué)
- GB/T 15924-2010錫礦石化學(xué)分析方法錫量測定
- GB/T 14525-2010波紋金屬軟管通用技術(shù)條件
- GB/T 11343-2008無損檢測接觸式超聲斜射檢測方法
- GB/T 1040.3-2006塑料拉伸性能的測定第3部分：薄膜和薄片的試驗(yàn)條件
- 教師晉級專業(yè)知識和能力證明材料
評論
0/150
提交評論