`
eric.zhang
  • 浏览: 127352 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

fckeditor - 集成(2)

阅读更多
来自: http://sktoo.iteye.com
集成javascript步骤

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


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

<script type="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 高度 200
Value 编辑器初始化内容 空字符串
ToolbarSet 工具条集合的名称(Default,Basic,或自定义)  Default
BathPath 编辑器的基路径,BasePath要正确设置,以“/”结尾  /fckeditor


例如:

var oFCKeditor = new FCKeditor( 'MyFckeditor' ) ;
oFCKeditor.BasePath = "fckeditor/" ;
oFCKeditor.Width="80%";
oFCKeditor.Height="200";
oFCKeditor.Value="ok";
oFCKeditor.ToolbarSet="Basic";
fckeditor构造器



var fckeditor=function(instanceName,width,height,toolbarSet,value) ;  instanceName:编辑器输出的textarea元素的name属性或id属性的值,必须指定
其他参数会赋给同名属性

例如: 

var oFCKeditor = new FCKeditor( '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指令

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

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

分享到:
评论

相关推荐

    fckeditor-java-2.6-bin

    2. **API使用**:通过Java API,开发者可以在网页中嵌入FCKeditor,设置编辑器的配置,如宽度、高度、初始内容等。 3. **服务器端处理**:FCKeditor与服务器端交互,处理文件上传和保存编辑内容。对于Java应用,这...

    FCKeditor的相关资源fckeditor-java-2.6-bin,fckeditor-java-2.6-src,fckeditor-2.6.6

    2. **fckeditor-java-2.6-src**: 这是FCKeditor Java版的源代码包,对于开发者来说,源代码是理解其工作原理和进行定制化开发的重要参考资料。通过源代码,开发者可以查看内部函数实现,修改或扩展功能,以满足特定...

    fckeditor-java-2.4.1-bin

    3. **Java版本**:"fckeditor-java-2.4.1-bin"专为Java开发者设计,允许将FCKeditor集成到Java Web应用中。通过这个版本,开发者可以方便地在服务器端处理用户编辑的内容,例如数据验证、过滤或存储。 4. **服务器...

    fckeditor-java-2.4.1修改支持jdk1.4

    其Java版本(FCKeditor-java)使得开发者可以将这款编辑器无缝集成到Java应用程序中。然而,在2.4.1版本发布时,它默认支持的Java环境可能较高,不适用于仍运行在JDK 1.4环境的项目。本文将深入探讨如何通过对源码...

    fckeditor-java-2.4.1-src.zip_FCKeditor jsp_fckeditor-java_fcked

    在Java环境下,FCKeditor提供了fckeditor-java版本,使得Java开发者能够方便地在Web应用中集成这款编辑器,提供丰富的文本编辑功能。 标题中的"fckeditor-java-2.4.1-src.zip"表明这是一个FCKeditor的Java版本源码...

    fckeditor-java-2.6-src

    要将FCKeditor集成到Java应用中,你需要了解如何在Servlet或JSP中嵌入编辑器,配置相应的路径,处理上传的文件,以及在服务器端接收和返回编辑内容。这通常涉及设置JavaScript变量,配置URL映射,以及处理HTTP请求...

    FCKeditor_2.6.5.zip,fckeditor-java-demo-2.5.war

    2. **丰富的编辑功能**:FCKeditor提供了插入图片、链接、表格、样式选择、格式化文本等多种编辑工具,让非专业程序员也能轻松编辑HTML内容。 3. **可定制性**:开发者可以根据需求自定义编辑器的外观和功能,通过...

    fckeditor-java-demo-2.4.1.war

    2. **fckeditor.gif**:这可能是一个FCKeditor的图标或logo,用于在网页上标识编辑器或者作为品牌标志。 3. **sampleslist.jsp**:这是一个JSP(Java Server Pages)文件,用于列出和展示FCKeditor的各种示例。...

    fckeditor-java-2.5-bin.zip

    3. **自定义集成**:FCKeditor可以方便地集成到任何Java Web应用程序中,如Java Servlets、JSP、Struts、Spring MVC等框架。通过提供API和示例代码,开发者可以定制编辑器的外观和功能,以满足特定项目需求。 4. **...

    fckeditor-java-2.4

    2. **插件系统**:Fckeditor-java-2.4支持自定义插件,开发者可以根据需求扩展编辑器的功能,例如添加代码高亮、地图集成、社交媒体分享按钮等。 3. **跨浏览器兼容性**:作为一个Web组件,Fckeditor-java-2.4设计...

    fckeditor-java-2.4.1-bin.zip+ckeditor_3.1.zip

    Java版本的FCKeditor通常用于服务器端集成,允许开发者通过Java应用程序或Web应用来实现客户端的富文本编辑功能。它提供了API接口,方便开发者自定义编辑器的行为和外观,以满足特定项目的需求。此版本可能包括了...

    fckeditor-for-wordpress

    在WordPress中集成fckeditor-for-wordpress插件后,用户可以在撰写和编辑文章时,通过富文本编辑器直接进行样式设置,而无需编写HTML代码。这使得文章的排版更加灵活,对于那些不熟悉HTML或者想要快速发布内容的用户...

    wp 插件 fckeditor-for-wordpress-plugin.3.3.1

    FCKeditor for WordPress 插件是将此编辑器集成到WordPress平台的工具,版本3.3.1代表了该插件的一个特定更新,旨在增强用户在WordPress网站上编辑内容的能力。 **核心功能与特点** 1. **富文本编辑**: FCKeditor ...

    PGV-Module-fckeditor-4.2

    总的来说,PGV-Module-fckeditor-4.2通过集成FCKeditor 4.2,为PGV带来了强大的文本编辑功能,使得用户在享受相册管理服务的同时,也能体验到高效便捷的内容创作。无论是对于个人用户还是管理员,这一模块都极大地...

    fckeditor2.6.3b+fckeditor-java-2.4+slf4j-1.5.2

    2. 创建一个Servlet来处理FCKeditor的请求,如文件上传。 3. 配置web.xml,将Servlet映射到特定URL。 4. 在JSP页面中实例化FCKeditor,并设置编辑器的属性,如宽度、高度、初始内容等。 5. 测试编辑器的功能,确保...

    fckeditor-java-2.4.1-src

    2. **服务器端集成**:FCKeditor-java-2.4.1通常会与Servlet容器(如Tomcat)配合使用,实现与Java Web应用的无缝集成。 3. **安全性**:在Java版本中,开发者需要关注如何安全地处理用户上传的文件,防止XSS攻击和...

    fckeditor-java-core-2.4.1

    3. **插件扩展**:FCKeditor允许开发者编写自定义插件,以增加更多的编辑功能或集成其他服务,如上传图片、视频等。 4. **兼容性**:在2.4.1版本中,FCKeditor已经较好地兼容了各种主流浏览器,如IE、Firefox、...

    FCKeditor-2.2.gz

    在描述中提到的“FCKeditor - JSP Integration Pack ver 2.2”表明这是专门为Java Server Pages (JSP) 平台设计的集成包,使得开发者能够轻松地在JSP应用中嵌入FCKeditor。 FCKeditor的主要功能包括: 1. **富文本...

Global site tag (gtag.js) - Google Analytics