首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

FCKeditor在java中应用的方法

2012-07-24 
FCKeditor在java中使用的方法一、下载FCKeditor需要下载两个包:1、FCKeditor_2.3.1.zip地址:http://www.fck

FCKeditor在java中使用的方法
一、下载FCKeditor;

    需要下载两个包:
    1、FCKeditor_2.3.1.zip   地址:http://www.fckeditor.net/download/default.html
    2、FCKeditor-2.3.zip (for java)   地址:http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=129511,注意要下载2005-08-11的2.3版本
    

二、在Eclipse里面新建一个工程,然后把上面两个包的部分文件(对你有用的)考进工程相应目录,

    1、解压缩FCKeditor-2.3.zip,在FCKeditor-2.3\web\WEB-INF\lib里面你会看到commons-fileupload.jar和FCKeditor-2.3.jar这两个jar包,考入你工程里面的\workspace\yjhmily\WebRoot\WEB-INF\lib(yjhmily是我的工程名)中,其中commons-fileupload.jar已经存在,覆盖就行了!
    2、解压缩FCKeditor_2.3.1.zip,在\FCKeditor_2.3.1\FCKeditor中你会看到一个editor文件夹,这里面放的是一些必须的HTML、JS、skin、images、css……等文件,将整个文件夹考入你工程里面的\workspace\yjhmily\WebRoot\FCKeditor\editor中,其中FCKeditor是我自己建的目录,便与标识。当然,你也可以直接把editor文件夹考到WebRoot目录下。
    3、将\FCKeditor_2.3.1\FCKeditor中的fckconfig.js、fckeditor.afp、fckeditor.cfc、fckeditor.cfm、fckeditor.js、fckeditor.lasso、fckstyles.xml、fcktemplates.xml全部考入\workspace\yjhmily\WebRoot\FCKeditor下。其实只要保证这些文件跟editor在同一目录下就可以了!

三、我的工程结构图:

fck.jpg
4、修改FCKeditor/fckconfig.js,把FCKConfig.LinkBrowserURL等的值替换成以下内容:
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Connector=connectors/jsp/connector" ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector" ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector" ;
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=File' ; 
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash' ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image' ;

5、修改web.xml文件,添加以下内容
    <servlet>
        <servlet-name>SimpleUploader</servlet-name>
        <servlet-class>com.fredck.FCKeditor.uploader.SimpleUploaderServlet</servlet-class>
        <init-param>
            <param-name>baseDir</param-name>
            <param-value>/UserFiles/</param-value>
        </init-param>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>enabled</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>AllowedExtensionsFile</param-name>
            <param-value></param-value>
        </init-param>
        <init-param>
            <param-name>DeniedExtensionsFile</param-name>
            <param-value>php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi</param-value>
        </init-param>
        <init-param>
            <param-name>AllowedExtensionsImage</param-name>
            <param-value>jpg|gif|jpeg|png|bmp</param-value>
        </init-param>
        <init-param>
            <param-name>DeniedExtensionsImage</param-name>
            <param-value></param-value>
        </init-param>
        <init-param>
            <param-name>AllowedExtensionsFlash</param-name>
            <param-value>swf|fla</param-value>
        </init-param>
        <init-param>
            <param-name>DeniedExtensionsFlash</param-name>
            <param-value></param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
<servlet>
  <servlet-name>Connector</servlet-name>
  <servlet-class>com.fredck.FCKeditor.connector.ConnectorServlet</servlet-class>
  <init-param>
   <param-name>baseDir</param-name>
   <param-value>/UserFiles/</param-value>
  </init-param>
  <init-param>
   <param-name>debug</param-name>
   <param-value>false</param-value>
  </init-param>
  <load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
  <servlet-name>Connector</servlet-name>
  <url-pattern>/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>
</servlet-mapping>
<servlet-mapping>
     <servlet-name>SimpleUploader</servlet-name>
     <url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
</servlet-mapping>
  <servlet-mapping>

6、jsp调用FCKeditor的几种方式:
a. 使用FCKeditor自定义标签
<%@   page contentType="text/html;charset=UTF-8" language="java"%>
<%@   taglib uri="/WEB-INF/FCKeditor.tld " prefix="fck"%>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
    <!-- 标签调用方式 -->
        <FORM action="show.jsp">
            <fck:editor id="content" basePath="/test/fckeditor/" height="400"
                width="800" skinPath="/test/fckeditor/editor/skins/default/"
                toolbarSet="Default"
                imageBrowserURL="/test/fckeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector"
                linkBrowserURL="/test/fckeditor/editor/filemanager/browser/default/browser.html?Connector=connectors/jsp/connector"
                flashBrowserURL="/test/fckeditor/editor/filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector"
                imageUploadURL="/test/fckeditor/editor/filemanager/upload/simpleuploader?Type=Image"
                linkUploadURL="/test/fckeditor/editor/filemanager/upload/simpleuploader?Type=File"
                flashUploadURL="/test/fckeditor/editor/filemanager/upload/simpleuploader?Type=Flash">
            </fck:editor>
            <input type="submit" value="提交">
        </FORM>
    </body>
</html>
b. 用Javascript脚本语言调用
<%@   page contentType="text/html;charset=UTF-8" language="java"%>
<html>
    <head>
        <title>Test</title>
        <script type="text/javascript" src="/test/fckeditor/fckeditor.js"></script>
    </head>
    <body>
        <form action="show.jsp" method="get">
            <table border="0" width="700">
                <tr>
                    <td>
                        <textarea id="content" name="content"
                            style="WIDTH: 100%; HEIGHT: 400px">input</textarea>
                        <script type="text/javascript">
                            var oFCKeditor = new FCKeditor('content') ;
                            oFCKeditor.BasePath = "/test/fckeditor/" ;
                            oFCKeditor.Height = 400;
                            oFCKeditor.ToolbarSet = "Default" ;
                            oFCKeditor.ReplaceTextarea();
                        </script>
                        <input type="submit" value="Submit">
                    </td>
                </tr>
            </table>
        </form>
    </body>
</html>
c. FCKeditor API 调用
<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ page language="java" import="com.fredck.FCKeditor.*" %>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <form action="show.jsp" method="post">
        <%
        FCKeditor oFCKeditor ;
        oFCKeditor = new FCKeditor( request, "content" ) ;
        oFCKeditor.setBasePath( "/test/fckeditor/" ) ;
        oFCKeditor.setValue( "input" );
        oFCKeditor.setWidth("800");
        out.println(oFCKeditor.create()) ;
        %>
        <br>
        <input type="submit" value="Submit">
        </form>
    </body>
</html>
测试页面:show.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>My JSP 'test.jsp' starting page</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">  
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
</head>
<body>
     <%=new String(request.getParameter("content").getBytes("iso-8859-1"),"UTF-8")%>
</body>
</html>

热点排行