CKEditor在asp.net环境下的使用一例

以前习惯了FckEditor,编译为dll，一直在Asp.net环境下使用正常。

今天试用了一下CKEditor3.3.2,下载地址：http://ckeditor.com/download

由于该版本重新架构，因而不采用dll的形式，而代之以js模式。于是新建一项目(基于Framework 4)，项目结构如下：

一、首先配置CKEcitor

将下载的ckeditor_3.3.2.zip解压到ckeditor下，删除_source和_samples文件夹，保留lang文件夹下仅en.js,zh-cn.js,zh.cs,其余删除。

修改config.js文件，增加如下内容：

CKEDITOR.editorConfig = function ( config )
{
config.language = ' zh-cn ' ;
config.uiColor = ' #336699 ' ;
config.height = 300 ; // 高度
// 工具栏
config.toolbar =
[
[ ' Bold ' , ' Italic ' , ' Underline ' , ' Strike ' , ' - ' , ' Subscript ' , ' Superscript ' ],
[ ' NumberedList ' , ' BulletedList ' , ' - ' , ' Outdent ' , ' Indent ' , ' Blockquote ' ],
[ ' JustifyLeft ' , ' JustifyCenter ' , ' JustifyRight ' , ' JustifyBlock ' ],
[ ' Link ' , ' Unlink ' , ' Anchor ' ],
[ ' Image ' , ' Flash ' , ' Table ' , ' HorizontalRule ' , ' Smiley ' , ' SpecialChar ' , ' PageBreak ' ],
' / ' ,
[ ' Styles ' , ' Format ' , ' Font ' , ' FontSize ' ],
[ ' TextColor ' , ' BGColor ' ],
[ ' Maximize ' , ' ShowBlocks ' , ' - ' , ' Source ' , ' - ' , ' Undo ' , ' Redo ' ]

];
};

 

二、新建一demoEditor.aspx，页面中添加如下：

< script type ="text/javascript" src ="ckeditor/ckeditor.js" ></ script >

及如下：

< div >
< asp:TextBox ID ="txtSource" runat ="server" Height ="200px" TextMode ="MultiLine"
Width ="575px" ></ asp:TextBox >

< script type ="text/javascript" >
// 关键！
CKEDITOR.replace( ' <%= txtSource.ClientID %> ' , { skin: ' kama ' });
</ script >
</ div >
< div >
< asp:Button ID ="btnGet" runat ="server" onclick ="btnGet_Click" Text ="取值" />
　　　　 < asp:Button ID ="btnSet" runat ="server" onclick ="btnSet_Click" Text ="赋值" />
< br />
< br />
< asp:TextBox ID ="txtValue" runat ="server" Height ="200px" TextMode ="MultiLine"
Width ="575px" ></ asp:TextBox >
</ div >

后台代码如下：

public partial class demoEditor : System.Web.UI.Page
{

#region Methods
void Page_Error( object sender, EventArgs e)
{

Exception ex = Server.GetLastError();
Response.Write( " an error occurer: " + ex.Message);
if (ex.InnerException != null )
{
Response.Write( " detailed: " + ex.InnerException.Message);
}
Server.ClearError();
}

#endregion

#region Events

protected void Page_Load( object sender, EventArgs e)
{
// this.Error += new EventHandler(Page_Error);
}

protected void btnGet_Click( object sender, EventArgs e)
{
string value = txtSource.Text;
Page.Response.Write(value);
}

protected void btnSet_Click( object sender, EventArgs e)
{
txtSource.Text = txtValue.Text;

}
#endregion

}

三　调试页面，出现“A potentially dangerous Request.Form value was detected from the client",按照经验，在web.config中增加

< system.web >
< pages validateRequest ="false" />
</ system.web >

还是同样错误，在页面头部加入，

<% @ Page validateRequest = " false " %>

还是出错。

后来终于试着在config.js文件中添加下面一行：

config.htmlEncodeOutput = true ;

OK!

源码下载：
DemoCkEditorAll

转载于:https://www.cnblogs.com/downmoon/archive/2010/08/09/1796145.html