最近刚刚做完一个网站项目这几天把自己在此过程中学习到的东西,总结一下,哈哈
先说一下FCKEditor配置。
FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。它志于轻量化,不需要太复杂的安装步骤即可使用。它可和PHP、JavaScript、ASP、ASP.NET、ColdFusion、Java、以及ABAP等不同的编程语言相结合。“FCKeditor”名称中的“FCK” 是这个编辑器的作者的名字Frederico Caldeira Knabben的缩写
1. 我们常用的配置文件是fckconfig.js这个js
常用的配置:FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/mac/' ;//皮肤设置 “'skins/mac/”皮肤的位置
//工具栏配置
FCKConfig.ToolbarSets["Default"] =[
['Source','-','Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','Rule','Smiley'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
// No comma for the last row.
] ;
配置文件 fckeditor.js是FCKeditor初始化的一些配置
var FCKeditor = function( instanceName, width, height, toolbarSet, value )
{
// Properties
this.InstanceName = instanceName ;
this.Width = width || '100%' ;//初始化宽度
this.Height = height || '200' ; ;//初始化高度
this.ToolbarSet = toolbarSet || 'Default' ; //初始化工具栏名称
this.Value = value || '' ;
this.BasePath = FCKeditor.BasePath ;
this.CheckBrowser = true ;
this.DisplayErrors = true ;
this.Config = new Object() ;
// Events
this.OnError = null ; // function( source, errorNumber, errorDescription )
}
2. 将FCKeditor编辑器文件组ASP.NET化
FCKeditor编辑器文件组包含了用于它所支持的各种应用技术的文件,所以,对于ASP.NET应用来说,有很多文件是不需要的。
根目录下,只保留文件夹editor,文件fckconfig.js、fckeditor.js、fckpackager.xml、fckstyles.xml和fcktemplates.xml。
子目录editor/filemanager/connectors下,只保留文件夹aspx。
3.Web.cong 的配置
<appSettings>
//BasePath 即FCKeditor在网站中的相对路径,默认值是 /fckeditor/,最好在Web.config appSettings中对其进行配置:
<add key="FCKeditor:BasePath" value="~/fckeditor/"/>
//FCKeditor的文件上传(如图片上传)目录可以通过Web.config appSettings进行配置
<add key="FCKeditor:UserFilesPath" value="~/UploadFiles/"/>
</appSettings>
4.开发过程中遇到的问题
FCKeditor 验证非空用RequiredFieldValidator控件不能用,用CustomValidator控件验证
JS代码: <script language="javascript" type="text/javascript">
var oEditer;
//函数名与ClientValidationFunction值对应
function FCKeditorValidate(source, arguments)
{
var value = oEditer.GetXHTML(true);
if(value=="")
{
arguments.IsValid = false;
}
else
{
arguments.IsValid = true;
}
}
function FCKeditor_OnComplete( editorInstance )
{
oEditer = editorInstance;
}
</script>
HTML 代码:<FCKeditorV2:FCKeditor ID="EditorText" runat="server" Height="200px" Width="98%">
</FCKeditorV2:FCKeditor>
<asp:CustomValidator ID="rfv_guestContent" runat="server" ErrorMessage= "不能招聘 新 闻 内容!" ClientValidationFunction ="FCKeditorValidate" ValidateEmptyText ="true" ></asp:CustomValidator>
5.在页面中选择自定义工具栏的编辑器
ToolbarSet="Basic"// Basic是在fckconfig.js中配置的工具栏名称
<FCKeditorV2:FCKeditor ID="EditorText" ToolbarSet="Basic" runat="server" Height="200px" Width="98%">
</FCKeditorV2:FCKeditor>