http://www.cnblogs.com/cxd4321/archive/2013/01/30/2883078.html

目前市面上用的比较多的富文本编辑器有：

FreeTextBox 一个有很多年历史的富文本编辑器了，使用简单，而且一般的使用是免费的，但是不开源，上传图片上传附件等功能没有，扩展性差。

CuteEditor最强大的富文本编辑器，巨牛无比，但是是收费的，个人使用的话用下破解版倒无所谓，要想在企业中使用那就得买了，所以虽然强大，但是想节约的话就不考虑这个了。看看他的菜单就知道他有多牛了：

FCKEditor（升级版CKEditor）强大的开源富文本编辑器，各个语言中都可以使用。支持上传图片、Flash等，功能强扩展性强。

TinyMCE 也是一个开源的富文本编辑器，不过名气没有FCKEditor大，功能还是不错。

KindEditor一个国人开发的富文本编辑器，貌似还不错，没有深入研究。

下面我写了一个很简单CKEditor实例

web.xml

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <web-app version="2.5"
  3. xmlns="http://java.sun.com/xml/ns/javaee"
  4. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  5. xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
  6. http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
  7. <filter>
  8. <filter-name>struts2</filter-name>
  9. <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
  10. </filter>
  11. <filter-mapping>
  12. <filter-name>struts2</filter-name>
  13. <url-pattern>/*</url-pattern>
  14. </filter-mapping>
  15. <welcome-file-list>
  16. <welcome-file>index.jsp</welcome-file>
  17. </welcome-file-list>
  18. </web-app>

CkeditorAction

  1. import com.opensymphony.xwork2.ActionSupport;
  2. public class CkeditorAction extends ActionSupport{
  3. private String editor1;
  4. public String execute(){
  5. <strong>System.out.println(editor1);</strong>
  6. return SUCCESS;
  7. }
  8. public String getEditor1() {
  9. return editor1;
  10. }
  11. public void setEditor1(String editor1) {
  12. this.editor1 = editor1;
  13. }
  14. }

在控制台打印使用CKEditor从页面传过来的的CKEditor文本内容，

struts.xml

  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE struts PUBLIC
  3. "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
  4. "http://struts.apache.org/dtds/struts-2.0.dtd">
  5. <struts>
  6. <package name="wan" extends="struts-default">
  7. <!--导出Ckeditor  -->
  8. <action name="Ckeditor" class="com.wanwan.app.action.CkeditorAction">
  9. <result name="success">/ce/uploadImage.jsp</result>
  10. </action>
  11. </package>
  12. </struts>

index.jsp

  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2. <%
  3. String path = request.getContextPath();
  4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
  5. %>
  6. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  7. <html>
  8. <head>
  9. <base href="<%=basePath%>">
  10. <title>富文本框</title>
  11. <strong><script type="text/javascript" src="ckeditor/ckeditor.js"></script></strong>
  12. <script type="text/javascript">
  13. </script>
  14. </head>
  15. <body>
  16. <form action="Ckeditor" method="post" >
  17. <strong><textarea id="editor1" name="editor1"><p>Initial value.</p></textarea><br/>
  18. <script type="text/javascript">
  19. CKEDITOR.replace( 'editor1' );
  20. </script></strong>
  21. <input type="submit" value="提交">
  22. </form>
  23. </body>
  24. </html>

注意粗体部分，引用ckeditor

说明：以上代码是将CKEditor文本类容传到action，并且在action打印出来，相信看到的人会连接数据库，这里我就不写了，一般数据库类型可以用大文本或者CLOB，当然可以直接生成一个静态页面，

常用的富文本框插件FreeTextBox、CuteEditor、CKEditor、FCKEditor、TinyMCE、KindEditor ；和CKEditor实例的更多相关文章

  1. Extjs4.2x与富文本框编辑器KindEditor的整合

    Extjs4本身的HtmlEditor编辑器,太鸡肋了,简单的html能够应付一下,稍加复杂的就无能为力了. 对于Extjs的HtmlEditor扩展主要有三个方向,一个是扩展其本身的htmlEdit ...

  2. 基于bootstrap的富文本框——wangEditor【欢迎增加开发】

    先来一张效果图: 01. 引言 老早就開始研究富文本框的东西,在写完<深入理解javascript原型与闭包>之后,就想着要去做一个富文本框的插件的样例. 如今网络上开源的富文本框插件许多 ...

  3. Selenium常用API用法示例集----下拉框、文本域及富文本框、弹窗、JS、frame、文件上传和下载

    元素识别方法.一组元素定位.鼠标操作.多窗口处理.下拉框.文本域及富文本框.弹窗.JS.frame.文件上传和下载 元素识别方法: driver.find_element_by_id() driver ...

  4. H5页面设计器，仿有赞商城页面在线设计器，比富文本框更友好的内容编辑器

    基本上每个web应用,都会牵扯到内容编辑,尤其是移动的web应用,微信开发之类的.页面内容自定义是最常用的功能了,之前大部分解决方案都是采用富文本框编辑器kindeditor,ueditor,cked ...

  5. Android 富文本框实现 RichEditText

    Android系统自带控件没有富文本框控件,如果想写一封带格式的邮件基本上不可能,EdtiText只有默认一种格式,显示不能滿足要求,!!正好项目需要研究了一下,开发了此控件,现将一些源代码开放一下, ...

  6. 百度umeditor富文本编辑器插件扩展

    富文本编辑器在WEB开发中经常用到,个人比较喜欢用百度出的ueditor这款,ueditor这款本身支持插件扩展的,但是ueditor的mini版本 umeditor 就没有那么方便了,不过找了很多资 ...

  7. 第三百九十五节，Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框

    第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框 首先安装DjangoUeditor3模块 Ueditor HTML编辑器是百度开源的HTML编辑器 下载 ...

  8. web轻量级富文本框编辑

    前言 主要介绍squire,wangeditor富文本编辑 以及用原生js 如何实现多个关键字标识 需求 如何标记多个关键字,取消关键字 第一种方法 原生 textarea 标记 准备资料参考:张鑫旭 ...

  9. vue集成ckeditor富文本框，怎么获取CKEditor实例？

    CKEDITOR 版本5 ,vue集成形式 vue集成ckeditor富文本框,由于不是通过js创建的富文本对象,所以,无法取得实例对象,官方说明 官方在builds-->Getting and ...

随机推荐

  1. 版本控制工具--GIT 基本命令（1）

    一.安装GIT,在官网上下载安装即可(下面模拟环境是window7) 二.基本操作: 1.创建GIT库: ①先使用mkdir命令创建一个空目录,再使用git init将该目录变成GIT库,会在该目录下 ...

  2. C/C++编译过程理解【转】

    转载自:http://www.cppblog.com/woaidongmao/archive/2008/11/07/66254.aspx 今天,通过自己的努力终于对C/C++的编译过程有了个粗略的了解 ...

  3. 小技巧：SystemTray中进行操作提示

    SystemTray中进行操作提示在wp中应用比较广泛,截图如下. 实现方法也十分简单 1.xaml代码中写入: shell:SystemTray.IsVisible="True" ...

  4. 《SELinux安全上下文的管理（含图）》RedHat6.3——步骤详细、条理清晰

    1.为什么浏览器只识别/var/www/html下的文件? 2.为什么不识别别的目录下的index.html文件呢? 3.这里牵扯到身份证,先安装软件包. 4.打开selinux 5.建立一个新的目录 ...

  5. Android TextUtil

    Android中计算textView长度问题 今天有一个需求,需要TextView显示两行的信息,但是右下角区域需要空出来,要来显示一张小图片,要实现的效果如图所示. 这里遇到的问题是计算TextVi ...

  6. 小米2s换了屏幕后不能近距离对焦，拆过后无法对焦?

    主要问题就是小米2/2S手机中壳套后摄像头的位置,里面还有一个正方形的黑色塑胶垫片,一般拆机后这个垫片是不会掉出来的,所以一般上盖时也是直接把中壳合上后上螺丝. 这样安装基本会导致塑胶垫片把摄像头顶住 ...

  7. linux系统文件属性及企业精典故障案例

    linux系统文件属性: [root@nginx_back ~]# stat keepalived-1.2.7.tar.gz 查看文件属性 File: "keepalived-1.2.7.t ...

  8. 在MVVMLight框架的ViewModel中实现NavigationService

    网上已经有很多方法了,比如通过Messenger来实现等等.这里我只讲述一种我比较喜欢的方法,因为它很方便 首先定义一个ViewModel基类,将所有ViewModel子类继承这个基类.在基类中定义 ...

  9. 1030. Travel Plan (30)

    时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue A traveler's map gives the dista ...

  10. android.support.v7.app.AppCompatActivity

    1.Android Studio (api 23) 新建项目的时候 Activity public class MainActivity extends AppCompatActivity 2.系统默 ...