在线文本编辑器（CKEditor）使用方法！

CKEditor（在线文本编辑器）+CKFinder(文件管理器插件)

         常用的在线文本编辑器有:FCKEditor,CKEditor,xheditor(jquery),easyEditor  。jquery

 

         配置步骤：

1.       需要把ckeditor和ckfinder相应的资源包，加入到当前web项目的根目录

如下图:

2.       导入所需要的jar包

3.       在WEB-INF下面添加一个xml的配置文件config.xml（需要有一个完整的confix.xml文件，下面三句话是改正的语法）

<enabled>true</enabled>à表示启用ckfinder文件管理器

<baseDir></baseDir>à设置为空，否则上传图片回报404错误

<baseURL>/javaWeb_demo/upload/</baseURL>-à配置文件上传的存放的路径，一定要加上项目名称，而且项目名称前面一定要有/

4.       配置web.xml（直接粘贴到web.xml即可，不需要改动）

<!-- ckfinder -->

    <servlet>

       <servlet-name>ConnectorServlet</servlet-name>

       <servlet-class>com.ckfinder.connector.ConnectorServlet</servlet-class>

    <init-param>

       <param-name>XMLConfig</param-name>

           <param-value>/WEB-INF/config.xml</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>ConnectorServlet</servlet-name>

       <url-pattern>

           /ckfinder/core/connector/java/connector.java

       </url-pattern>

    </servlet-mapping>

    <session-config>

       <session-timeout>10</session-timeout>

    </session-config>

5.       jsp页面使用

有两种方式

第一种发方式就是导入ckeditor和ckfinder的核心js文件

<script type="text/javascript" src="ckeditor/ckeditor.js"></script>

<script type="text/javascript" src="ckfinder/ckfinder.js"></script>

 

页面通过textarea属性进行控制，代码如下:

<textarea cols="200" id="content" name="content"></textarea>

          

          

           <script type="text/javascript">

              var content1 =  CKEDITOR.replace('content');

              CKFinder.setupCKEditor(content1, '../ckfinder');

           </script>

第二种方式通过导入ckeditor或者ckfinder的自定义标签库