FCKeditor简单使用实例（for jsp）

最新推荐文章于 2021-04-15 17:53:05 发布

SuJFighting

最新推荐文章于 2021-04-15 17:53:05 发布

阅读量2.9k

点赞数

分类专栏： Jsp&&Servlet 文章标签： fckeditor jsp stylesheet string properties function

Jsp&&Servlet 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

   使用的版本：
   FCKeditor_2.6.3
   fckeditor-java-2.4-bin

1. 新建一WEB项目，将一下jar包放到lib中：
commons-fileupload-1.2.1.jar
commons-io-1.3.2.jar
slf4j-api-1.5.2.jar
slf4j-simple-1.5.2.jar
fckeditor-java-core-2.4.jar

2. 将fckeditor放到WebRoot目录中

3. web.xml文件中添加

Xml代码

<servlet>
<servlet-name>Connector</servlet-name>
<servlet-class>net.fckeditor.connector.ConnectorServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
</servlet-mapping>

  <!-- FCKeditor配置 --> 
  <servlet>
  	<servlet-name>Connector</servlet-name>
  	<servlet-class>net.fckeditor.connector.ConnectorServlet</servlet-class>
  	<load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
  	<servlet-name>Connector</servlet-name>
  	<url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
  </servlet-mapping>
  <!-- FCKeditor配置 -->

4. 在src中新建fckeditor.properties文件：

Properties代码

#Fckeditor setting
#用户上传文件路径目录
connector.userFilesPath=/userUploadFile
connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl

#Fckeditor setting
#用户上传文件路径目录
connector.userFilesPath=/userUploadFile
connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl

5. jsp页面：

Html代码

<%@ page contentType="text/html;charset=utf-8" %>
<%@ page import="java.util.*" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<link href="<%=basePath %>/fckeditor/_samples/sample.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=basePath %>/fckeditor/fckeditor.js"></script>
<script type="text/javascript">
//初始化fckeditor
window.onload = function()
{
var sBasePath = "<%=basePath %>/fckeditor/";
var oFCKeditor = new FCKeditor( 'content' ) ;
oFCKeditor.BasePath = sBasePath ;
oFCKeditor.ReplaceTextarea() ;
}
</script>
<html>
<head>
<title>fckeditor_demo</title>
</head>
<body>
<form action="showdata.jsp" method="post">
<textarea name="content" rows="10" cols="80" style="width: 100%; height: 200px" ></textarea>
<br>
<input type="submit" value="提交"/>
</form>
</body>
</html>

<%@ page contentType="text/html;charset=utf-8" %>
<%@ page import="java.util.*" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<link href="<%=basePath %>/fckeditor/_samples/sample.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=basePath %>/fckeditor/fckeditor.js"></script>
<script type="text/javascript">

//初始化fckeditor
window.onload = function()
{
	var sBasePath = "<%=basePath %>/fckeditor/";
	var oFCKeditor = new FCKeditor( 'content' ) ;
	oFCKeditor.BasePath	= sBasePath ;
	oFCKeditor.ReplaceTextarea() ;
}
</script>
<html>
  <head>
    <title>fckeditor_demo</title>
  </head>
  <body>
  <form action="showdata.jsp" method="post">
   <textarea   name="content" rows="10" cols="80" style="width: 100%; height: 200px" ></textarea>
   <br>
    <input type="submit" value="提交"/>
   </form>
  </body>
</html>

6. 提交后，后台取值通过

Java代码

String data = request.getParameter("content");

String data = request.getParameter("content");

取值。

项目目录结构：

FCKeditor_demo.rar (1.4 MB)

SuJFighting

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
FCKeditor简单使用实例（for jsp）

使用的版本： FCKeditor_2.6.3 fckeditor-java-2.4-bin 1. 新建一WEB项目，将一下jar包放到lib中： commons-fileupload-1.2.1.jar commons-io-1.3.2.jar slf4j-api-1.5.2.jar slf4j-simple-1.5.2.jar
复制链接

扫一扫