• Jsp页面中使用fckeditor控件的两种方法 [转]


    fckeditor控件请到官方网站下载http://www.fckeditor.net,本例主要用到FCKeditor_2.6.3.zip、fckeditor-java-demo-2.4.1.zip、fckeditor-java-2.4.1-bin.zip里面的一些内容,读者可以自行下载。

    1、解开压缩包FCKeditor_2.6.3.zip,将其中的fckeditor文件夹复制到WEB-INF下面,后面可以直接使用。

    2、在页面中使用FCKeditor有两种方式。
    方式一:JavaScript的方式
    (1)直接使用,见method1.html

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    2. <html>
    3.   <head>
    4.     <script type="text/javascript" src="fckeditor/fckeditor.js"></script>
    5.   </head>
    6.   <body>
    7.   方法一:通过JavaScript来实现的实现编辑器导入<br>
    8.     <script type="text/javascript">
    9.         var oFCKeditor = new FCKeditor('FCKeditor1') ;
    10.         oFCKeditor.BasePath = "fckeditor/";
    11.         //oFCKeditor.BasePath   = "/FCKEditTest/fckeditor/";
    12.         oFCKeditor.Width="50%";
    13.         oFCKeditor.Height="400";
    14.         oFCKeditor.Value="initial value";
    15.         //oFCKeditor.ToolbarSet="Basic";
    16.         //默认是default
    17.         oFCKeditor.ToolbarSet="Default";
    18.         oFCKeditor.Create() ;
    19.         </script>
    20.         <hr>
    21.   </body>
    22. </html>

    (2)通过Textarea,祥见method2.html

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    2. <html>
    3.   <head>
    4.     <script type="text/javascript" src="fckeditor/fckeditor.js"></script>
    5.    <script type="text/javascript">
    6.     window.onload=function(){
    7.         var oFCKeditor = new FCKeditor('MyTextarea') ;
    8.         oFCKeditor.BasePath = "fckeditor/";
    9.         //oFCKeditor.BasePath   = "/FCKEditTest/fckeditor/";
    10.         oFCKeditor.ReplaceTextarea();
    11.         }
    12.     </script>
    13.   </head>
    14.     <body>
    15.     方法二:通过Textarea来实现的实现编辑器导入<br>
    16.     <textarea rows="4" cols="60" name="MyTextarea">this is a value</textarea>
    17.       </body>
    18. </html>

    方式二:在标签使用FCKeditor
    在使用标签之前,需要搭建环境。将fckeditor-java-2.4.1-bin.zip包中的fckeditor-java-core-2.4.1.jar、commons-fileupload-1.2.1.jar、commons-io-1.3.2.jar、slf4j-api-1.5.2.jar以及包fckeditor-java-demo-2.4.1.zip中的slf4j-simple-1.5.2.jar复制到lib目录下,并构建环境。
    构建完后,就可以在JSP页面中进行使用。祥见页面method_jsp.jsp

    1. <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
    2. <%@ taglib uri="http://java.fckeditor.net" prefix="FCK"%>
    3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    4. <html>
    5.   <head>
    6.     <title>method_jsp.jsp</title>
    7.   </head>
    8.   <body
    9.        早些版本必需将fckeditor的Value属性必需指定对应的值,且值不能为空。
    10.     而此处版本是2.6.3,该问题已经解决。
    11.     <FCK:editor instanceName="myEditor" basePath="/fckeditor"></FCK:editor>
    12.   </body>
    13. </html>

    效果如下图:

  • 相关阅读:
    线程带参数操作
    静态页面不识别include
    当网站遭遇DDOS攻击的解决方案及展望
    带进度条上传控件
    用js实现了表格数据管理的以下几个功能:
    怎么面试一个人
    map的使用
    在Axapta中实现trim函数
    Axapta财务过账分析(一)
    在Axapta中实现split函数
  • 原文地址:https://www.cnblogs.com/whtydn/p/4978076.html
Copyright © 2020-2023  润新知