Fckeditor使用方法

来源:互联网 发布:值得下载的app 知乎 编辑:程序博客网 时间:2024/05/21 21:49

测试Fckeditor版本为:2.6.3

目前Fckeditor只能用于基于ie内核的浏览器,如果要使用于chrome等浏览器,请使用ckeditor。

具体使用方法:

1.将解压后的fckeditor整个文件夹复制到ProjectWebRoot路径下

2.在要使用Fckeditor的页面,导入fckeditor.js(在fckeditor文件夹里)文件

因为此处使用Fckeditor用到了jQuery,因此相应的jquery.js也要导入

[html] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <script language="javascript" src="${pageContext.request.contextPath}/script/jquery.js"></script>  
  2. <script language="javascript" src="${pageContext.request.contextPath}/fckeditor/fckeditor.js" charset="utf-8"></script>  

3.根据需要适当修改以下JS代码,复制到要使用Fckeditor的页面即可

[javascript] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <script type="text/javascript">  
  2.         $(function(){  
  3.             var fck = new FCKeditor("content");//content为要替换的textarea的name属性  
  4.             fck.Width = "99%";  
  5.             fck.Height = "100%";  
  6.             fck.ToolbarSet = "bbs";//指定工具栏的配置,bbs为我自己修改过的,如果不使用自定义配置文件,此处有Default,Basic两个选择  
  7.             fck.BasePath = "${pageContext.request.contextPath}/fckeditor/";  
  8.             fck.ReplaceTextarea();  
  9.         });  
  10. </script>  

 

替换成Fckeditor的textarea,名字和上面的替换的名字要一致。

[html] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <textarea name="content" style="width:650px;height:200px"></textarea>  

 

PS:代码解释

JS代码中各个参数具体作用(使用本js或者上文使用方法步骤3的代码都可以,两段代码大同小异)

[javascript] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <script type="text/javascript">  
  2.   
  3.         var oFCKeditor = new FCKeditor( 'content' ) ;//此参数会作为提交表单时的参数名  
  4.         oFCKeditor.BasePath = "/fckeditor/" ;//一定要指定editor文件夹所在的路径,并且要以'/'结尾  
  5.         oFCKeditor.Height   = 300 ;//高度  
  6.         oFCKeditor.Value    = '' ;//默认的初始值  
  7.         oFCKeditor.ToolbarSet="Basic";//指定工具栏的配置,默认为Default  
  8.         //oFCKeditor.Create() ;//在当前位置生成并显示Fckeditor  
  9.         oFCKeditor.ReplaceTextarea();//替换指定id或name属性的textarea为Fckeditor  
  10. </script>  

 

 

使用自定义的配置文件

1.在fckconfig.js里将FCKConfig.CustomConfigurationsPath = ''修改为:  FCKConfig.CustomConfigurationsPath = FCKConfig.EditorPath + "myconfig.js"  作用:告诉Fckeditor,我有个自定义的配置在该地址下的该文件。

2.在myconfig.js里写想修改的东西,例如:表情,Fckeditor菜单栏的减少等,模版在fckconfig.js里面有,参考着修改即可。没有修改的配置,Fckeditor默认使用自己的默认配置。

0 0
原创粉丝点击