fckeditor - 集成(2)

集成javascript步骤

参考文档：http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Integration/JavaScript

1.将JavaScript集成模块脚本放入<head>标签中

<scripttype="text/javascript"src="fckeditor/fckeditor.js"></script>

2.创建fckeditor

方法一：（内联）

在<body>标签适当位置放入如下代码（通常放在标签中）

<script> 
var oFCKeditor = new FCKeditor('FCKeditor1');
oFCKeditor.BasePath = "fckeditor/"; 
oFCKeditor.Create(); 
</script>

方法二：（替代<textarea>）

在<head>标签中添加onload方法

<script> 
window.onload = function() 
{ 
var oFCKeditor = new FCKeditor( 'MyTextarea' ) ; 
oFCKeditor.BasePath = "fckeditor/" ; 
oFCKeditor.ReplaceTextarea() ; 
} 
</script>

在<body>标签中添加以下代码

<textarea id="MyTextarea" name="MyTextarea"> 
This is <b>the</b> initial value.
</textarea>

方法三：（动态生成）

在<head>标签中定义createFckeditor()方法

<script> 
function createFckeditor()
{ 
var div = document.getElementById("myFCKeditorDiv"); 
var fck = new FCKeditor("myFCKeditor"); 
fck.BasePath = "fckeditor/" ; 
div.innerHTML = fck.CreateHtml(); 
} 
</script>

在中div中动态显示fckeditor

<a href="javascript:void(0);" onclick="createFckeditor();"> 动态创建fckeditor </a> 
<div id="myFCKeditorDiv"> </div>

fckeditor对象属性

属性名描述默认值Width宽度100%Height高度200Value编辑器初始化内容空字符串ToolbarSet工具条集合的名称(Default，Basic，或自定义)DefaultBathPath编辑器的基路径,BasePath要正确设置，以“/”结尾/fckeditor

例如：

varoFCKeditor=newFCKeditor('MyFckeditor');

oFCKeditor.BasePath="fckeditor/";

oFCKeditor.width="80%";

oFCKeditor.height="200";

oFCKeditor.Value="ok";

oFCKeditor.ToolbarSet="Basic";

fckeditor构造器

varfckeditor=function(instanceName,width,height,toolbarSet,value);instanceName:编辑器输出的textarea元素的name属性或id属性的值，必须指定

其他参数会赋给同名属性

例如:

varoFCKeditor=newFCKeditor('MyFckeditor','80%','300','Basic','ok');

集成java步骤

1.载入jar包

将fckeditor-java-demo-2.4.war放入运行中的tomcat安装目录下的webapps文件夹中让其解压，从解压后的fckeditor-java-demo-2.4\WEB-INF\lib下拷贝所有的jar文件，加入web工程的classpath中（可以拷贝到WebRoot\WEB-INF\lib文件夹下）

jar文件包括：

fckeditor-java-core-2.4.jar

commons-fileupload-1.2.1.jar

commons-io-1.3.2.jar

slf4j-api-1.5.2.jar

slf4j-simple-1.5.2.jar

2.在jsp页面中加入tablib指令和fck标签

参看fckeditor-java-core-2.4.jar/META-INF/FCKeditor.tld

<short-name>FCK</short-name>

<uri>http://java.fckeditor.net</uri>在jsp页面中加入tablib指令

<%@tagliburi="http://java.fckeditor.net"prefix="FCK"%>在<body>中加入自定义标签

<FCK:editorinstancename="fck1"basePath="/fckeditor"value=""></FCK:editor>注意：basePath以"/"开头代表工程的根路径而非web服务器的根路径，一定要指定value属性，而且值不能为空字符串"",否则会抛NullPointException。

fckeditor - 集成(2)

相关推荐