常用的富文本框插件FreeTextBox、CuteEditor、CKEditor、FCKEditor、TinyMCE、KindEditor ;和CKEditor实例
http://www.cnblogs.com/cxd4321/archive/2013/01/30/2883078.html
目前市面上用的比较多的富文本编辑器有:
FreeTextBox 一个有很多年历史的富文本编辑器了,使用简单,而且一般的使用是免费的,但是不开源,上传图片上传附件等功能没有,扩展性差。

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

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


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

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

下面我写了一个很简单CKEditor实例
web.xml
- <?xml version="1.0" encoding="UTF-8"?>
- <web-app version="2.5"
- xmlns="http://java.sun.com/xml/ns/javaee"
- xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
- xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
- http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
- <filter>
- <filter-name>struts2</filter-name>
- <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
- </filter>
- <filter-mapping>
- <filter-name>struts2</filter-name>
- <url-pattern>/*</url-pattern>
- </filter-mapping>
- <welcome-file-list>
- <welcome-file>index.jsp</welcome-file>
- </welcome-file-list>
- </web-app>
CkeditorAction
- import com.opensymphony.xwork2.ActionSupport;
- public class CkeditorAction extends ActionSupport{
- private String editor1;
- public String execute(){
- <strong>System.out.println(editor1);</strong>
- return SUCCESS;
- }
- public String getEditor1() {
- return editor1;
- }
- public void setEditor1(String editor1) {
- this.editor1 = editor1;
- }
- }
在控制台打印使用CKEditor从页面传过来的的CKEditor文本内容,
struts.xml
- <?xml version="1.0" encoding="UTF-8" ?>
- <!DOCTYPE struts PUBLIC
- "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
- "http://struts.apache.org/dtds/struts-2.0.dtd">
- <struts>
- <package name="wan" extends="struts-default">
- <!--导出Ckeditor -->
- <action name="Ckeditor" class="com.wanwan.app.action.CkeditorAction">
- <result name="success">/ce/uploadImage.jsp</result>
- </action>
- </package>
- </struts>
index.jsp
- <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
- %>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <base href="<%=basePath%>">
- <title>富文本框</title>
- <strong><script type="text/javascript" src="ckeditor/ckeditor.js"></script></strong>
- <script type="text/javascript">
- </script>
- </head>
- <body>
- <form action="Ckeditor" method="post" >
- <strong><textarea id="editor1" name="editor1"><p>Initial value.</p></textarea><br/>
- <script type="text/javascript">
- CKEDITOR.replace( 'editor1' );
- </script></strong>
- <input type="submit" value="提交">
- </form>
- </body>
- </html>
注意粗体部分,引用ckeditor
说明:以上代码是将CKEditor文本类容传到action,并且在action打印出来,相信看到的人会连接数据库,这里我就不写了,一般数据库类型可以用大文本或者CLOB,当然可以直接生成一个静态页面,
常用的富文本框插件FreeTextBox、CuteEditor、CKEditor、FCKEditor、TinyMCE、KindEditor ;和CKEditor实例的更多相关文章
- Extjs4.2x与富文本框编辑器KindEditor的整合
Extjs4本身的HtmlEditor编辑器,太鸡肋了,简单的html能够应付一下,稍加复杂的就无能为力了. 对于Extjs的HtmlEditor扩展主要有三个方向,一个是扩展其本身的htmlEdit ...
- 基于bootstrap的富文本框——wangEditor【欢迎增加开发】
先来一张效果图: 01. 引言 老早就開始研究富文本框的东西,在写完<深入理解javascript原型与闭包>之后,就想着要去做一个富文本框的插件的样例. 如今网络上开源的富文本框插件许多 ...
- Selenium常用API用法示例集----下拉框、文本域及富文本框、弹窗、JS、frame、文件上传和下载
元素识别方法.一组元素定位.鼠标操作.多窗口处理.下拉框.文本域及富文本框.弹窗.JS.frame.文件上传和下载 元素识别方法: driver.find_element_by_id() driver ...
- H5页面设计器,仿有赞商城页面在线设计器,比富文本框更友好的内容编辑器
基本上每个web应用,都会牵扯到内容编辑,尤其是移动的web应用,微信开发之类的.页面内容自定义是最常用的功能了,之前大部分解决方案都是采用富文本框编辑器kindeditor,ueditor,cked ...
- Android 富文本框实现 RichEditText
Android系统自带控件没有富文本框控件,如果想写一封带格式的邮件基本上不可能,EdtiText只有默认一种格式,显示不能滿足要求,!!正好项目需要研究了一下,开发了此控件,现将一些源代码开放一下, ...
- 百度umeditor富文本编辑器插件扩展
富文本编辑器在WEB开发中经常用到,个人比较喜欢用百度出的ueditor这款,ueditor这款本身支持插件扩展的,但是ueditor的mini版本 umeditor 就没有那么方便了,不过找了很多资 ...
- 第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框
第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框 首先安装DjangoUeditor3模块 Ueditor HTML编辑器是百度开源的HTML编辑器 下载 ...
- web轻量级富文本框编辑
前言 主要介绍squire,wangeditor富文本编辑 以及用原生js 如何实现多个关键字标识 需求 如何标记多个关键字,取消关键字 第一种方法 原生 textarea 标记 准备资料参考:张鑫旭 ...
- vue集成ckeditor富文本框,怎么获取CKEditor实例?
CKEDITOR 版本5 ,vue集成形式 vue集成ckeditor富文本框,由于不是通过js创建的富文本对象,所以,无法取得实例对象,官方说明 官方在builds-->Getting and ...
随机推荐
- vim全局替换
:1,$ s/cmss_//g 1,$代表第一行到最后一行 s代表替换 cmss_为要替换的内容 替换为空格,所以直接// g代表全局替换
- C++ 的template
vector的标准模板是:template<template<typename X, class allocator<X> > class T>而普通模板则是tem ...
- Centos7下安装netstat
刚安装centos7发想没有查看端口的命令 netstat yum install net-tools
- setTimeout/setInterval执行时机
setTimeout()和setInterval()经常被用来处理延时和定时任务.setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则可以在每隔指定的 ...
- Android开发系列之按钮事件的4种写法
经过前两篇blog的铺垫,我们今天热身一下,做个简单的例子. 目录结构还是引用上篇blog的截图. 具体实现代码: public class MainActivity extends Activity ...
- CentOS7安装nagios并配置出图详解
目录 开始之前 系统环境 监控内容 所需软件包 台机器,全都按照CentOS7最小化模式安装系统 系统版本号 [root@localhost ~]# cat /etc/redhat-release ...
- SSH-KEY服务及批量分发与管理实战
SSH服务 一.SSH服务介绍 SSH是Secure Shell Protocol的简写,由IETF网络工作小组制定:在进行数据传输之前,SSH先对联机数据包通过加密技术进行加密处理,加密后再进行数据 ...
- opencv学习笔记(03)——遍历图像(迭代器法)
#include <opencv2\highgui\highgui.hpp> #include <opencv2\imgproc\imgproc.hpp> #include & ...
- fedora 解决yumBackend.py进程CPU占用过高
fedora启动时电脑风扇噪声巨响,检查进行发现是yumBackend.py进行占用CPU过高. yumBackend.py进行是后台检查更新,如果觉得没用可以使用工具关闭检查更新,或者修改检查周期. ...
- 关于分区技术的索引 index
关于分区技术---索引 Index 一. 分区索引分类: 本地前缀分区索引(local prefixedpartitioned index) 全局分区索引(global partitionedin ...