asp.net中使用CKEditor
CKEditor是新一代的FCKeditor,是一個重新開發的版本。CKEditor是全球最優秀的網頁在線文字編輯器之一
網址:
CKEditor :http://ckeditor.com/
CKFinder :http://ckfinder.com/ 如果要上傳文件,則需使用它的插件ckfinder,如果我們只用它的在線編輯功能,那么可以不使用和配置ckfinder(我就是)
一、CKEditor 的使用
準備工作
1. 下載CKEditor并將其解壓到Web根目錄下
2. 精簡目錄:
_samples文件夾(示例文件,可以刪除)
_source文件夾(源程序文件,可以刪除)
changes.html(更新列表,可以刪除)
install.html(安裝指向,可以刪除)
license.html(使用許可,可以刪除)
CKEditor的配置(config.js文件)
3.使用
在需要載入編輯器的頁面導入腳本文件
<script language="javascript" type="text/javascript" src='<%=ResolveUrl("~/ckeditor/ckeditor.js")%>'></script> ,修改頁面的page指令ValidateRequest="false"
ok,再丟一個文本框<asp:TextBox ID="txtContent" class="ckeditor" TextMode="MultiLine"
Text='<%# Bind("info") %>' runat="server"></asp:TextBox>
注意:要設置class="ckeditor"
好了。現在運行頁面就可以看到很漂亮的界面了,如果只要在線編輯功能的話就已經大功告成了。
//獲取編輯器中的內容
Server.HtmlEncode( this.txtContent.Text);
//設置編輯器中的內容
this.txtContent.Text = Server.HtmlDecode("要設置的內容");
?
二、如果需要上傳功能,則還需配置下ckfinder
1. 下載CKFinder的Asp.NET版,將其解壓到Web根目錄下
2. 復制/bin/Release目錄下的ckfinder.dll文件至站點bin目錄
3. 精簡目錄:
_samples文件夾(示例文件,可以刪除)
_source文件夾(源程序文件,可以刪除)
CKFinder的配置
1. 打開 " \ckfinder\config.ascx ",為SetConfig方法中的 BaseUrl 指定默認路徑,如:
// 以userfiles 為默認路徑,其目錄下會自動生成images、flash等子目錄。
BaseUrl = " ~/ckfinder/userfiles/";
// NOTE:注意“ ~/ ”。
2. 與CKEditor集成
打開CKEditor目錄中的config.js文件在function 函數
CKEDITOR.editorConfig = function(config) {
……
};
在其中添加
// 在 CKEditor 中集成 CKFinder,注意 ckfinder 的路徑選擇要正確。
config.filebrowserBrowseUrl = location.hash + '/ckfinder/ckfinder.html';
config.filebrowserImageBrowseUrl = location.hash + '/ckfinder/ckfinder.html?Type=Images';
config.filebrowserFlashBrowseUrl = location.hash+'/ckfinder/ckfinder.html?Type=Flash';
config.filebrowserUploadUrl = location.hash + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files';
config.filebrowserImageUploadUrl = location.hash + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images';
config.filebrowserFlashUploadUrl = location.hash + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash';
// config.filebrowserWindowWidth = '800';
// config.filebrowserWindowHeight = '500';
1. 在工具欄中添加站點根目錄bin目錄中的ckfinder.dll控件
2. 拖放控件到Web頁面
?
常見問題
1. 癥狀:因為安全原因,文件不可瀏覽。請聯系系統管理員并檢查CKFinder配置文件。
原因:未設置用戶身份驗證或者用戶未登錄。
解決:在CKFinder的config.ascx文件中修改
public override bool CheckAuthentication()
{
return false;?//====這里改為true?
}
2. 癥狀:未知錯誤
原因:設置不進行用戶身份驗證,但是 BaseUrl 路徑不對。
解決:在CKFinder的config.ascx文件中的public override void SetConfig() 修改
// 以userfiles 為默認路徑,其目錄下會自動生成images、flash等子目錄。
BaseUrl = " ~/ckfinder/userfiles/";
// NOTE:注意“ ~/ ”。
3. 癥狀:訪問帶有CKFinder的頁面時報錯“HTTP 錯誤 404 - Not Found”
解決:修改CKFinder控件的BasePath屬性為ckfinder目錄的相對路徑
?
解決完所有問題后,當點擊CKEditor 中上傳時,會自動調用出CKFinder控件
轉載于:https://www.cnblogs.com/zcds-jk/archive/2013/05/26/4345271.html
總結
以上是生活随笔為你收集整理的asp.net中使用CKEditor的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: HDOJ 1069 Monkey and
- 下一篇: 如何解决Contacts中的多音字排序错