<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<title>Insert title here</title>

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

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

<script type="text/javascript">

$(function(){

    var fck=new FCKeditor("myTextArea");

    fck.BasePath="res/fckeditor/";

    fck.ReplaceTextarea();

})

</script>

</head>

<body>

<textarea rows="" cols="" id="myTextArea"></textarea>

</body>

</html>

以上是最基础的引入，同时可以自定义编辑框的工具栏，在fckconfig.js中复制

FCKConfig.ToolbarSets["Default"] = [

    ['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],

    ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],

    ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],

    ['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],

    '/',

    ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],

    ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],

    ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],

    ['Link','Unlink','Anchor'],

    ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],

    '/',

    ['Style','FontFormat','FontName','FontSize'],

    ['TextColor','BGColor'],

    ['FitWindow','ShowBlocks','-','About']        // No comma for the last row.

] ;

更改为

FCKConfig.ToolbarSets["myToolBar"] = [

                                    ['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],

                                    ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],

                                    ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],

                                    ['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField']

                                    ] ;

之后在jsp中添加

$(function(){

    var fck=new FCKeditor("myTextArea");

    fck.BasePath="res/fckeditor/";

    fck.ToolbarSet="myToolBar";//自定义工具栏

    fck.ReplaceTextarea();

})

fck支持图片上传到服务器，只要加入

//指定到后台Control层进行实现

fck.Config["ImageUploadURL"] = "/upload/uploadFck.do";

注意：写控制层时需要引入相应的jar包java-core-2.6.jar，使用该jar包提供的类来完成代码，如下：

// 上传Fck图片

    @RequestMapping(value = "/upload/uploadFck.do")

    public void uploadFck(HttpServletRequest request, HttpServletResponse response) {

        // 强转request 支持多个

        MultipartHttpServletRequest mr = (MultipartHttpServletRequest) request;

        // 获取值 支持多个

        Map<String, MultipartFile> fileMap = mr.getFileMap();

        // 遍历Map

        Set<Entry<String, MultipartFile>> entrySet = fileMap.entrySet();

        for (Entry<String, MultipartFile> entry : entrySet) {

            // 上传上来的图片

            MultipartFile pic = entry.getValue();

            // 扩展名

            String ext = FilenameUtils.getExtension(pic.getOriginalFilename());

            // 图片名称生成策略

            DateFormat df = new SimpleDateFormat("yyyyMMddHHmmssSSS");

            // 图片名称一部分

            String format = df.format(new Date());

            // 随机三位数

            Random r = new Random();

            // n 1000 0-999 99

            for (int i = 0; i < 3; i++) {

                format += r.nextInt(10);

            }

            // 实例化一个Jersey

            Client client = new Client();

            // 保存数据库

            String path = "upload/" + format + "." + ext;

            // 另一台服务器的请求路径是?

            String url = Constants.IMAGE_URL + path;

            // 设置请求路径

            WebResource resource = client.resource(url);

            // 发送开始 POST GET PUT

            try {

                resource.put(String.class, pic.getBytes());

            } catch (IOException e) {

                // TODO Auto-generated catch block

                e.printStackTrace();

            }

            // 返回Url给Fck fck-core...jar ckeditor

            UploadResponse ok = UploadResponse.getOK(url);

            // response 返回对象

            // response write

            // response print

            // 区别:

            // 字符流

            // 字节流

            try {

                response.getWriter().print(ok);

            } catch (IOException e) {

                // TODO Auto-generated catch block

                e.printStackTrace();

            }

        }

    }

fckeditor的简单使用的更多相关文章

  1. JavaWEB开发时FCKeditor类似office界面的ajax框架，加入后就能做界面类似office，能进行简单的文本编辑操作+配置手册...

    2019独角兽企业重金招聘Python工程师标准>>> FCKeditor是一款功能强大的开源在线文本编辑器(DHTML editor),它使你在web上可以使用类似微软Word 的 ...

  2. [转载]什么是FCKeditor？功能强大的HTML编辑器！

    天天在用FCKeditor写博客,但一直不清楚FCKeditor到底是什么,今天终于找到了一些相关的资料,大家一起来分享下. FCKeditor文本编辑程序(共享软件)为用户提供在线的文档编辑服务,其 ...

  3. FCKeditor使用方法技术详解

    转载自 http://www.cnblogs.com/cchyao/archive/2010/07/01/1769204.html 1.概述 FCKeditor是目前最优秀的可见即可得网页编辑器之一, ...

  4. SVN四部曲之SVN简单使用教程入门

    1.        签出源代码到本机 在本机创建文件夹StartKit,右键点击Checkout,弹出如下图的窗体: 2.        2 在上图中URL of Repository:下的文本框中输 ...

  5. 常用的富文本框插件FreeTextBox、CuteEditor、CKEditor、FCKEditor、TinyMCE、KindEditor ；和CKEditor实例

    http://www.cnblogs.com/cxd4321/archive/2013/01/30/2883078.html 目前市面上用的比较多的富文本编辑器有: FreeTextBox 一个有很多 ...

  6. asp.net文本编辑器（FCKeditor）

    FCKeditor介绍 FCKeditor是一个功能强大支持所见即所得功能的文本编辑器,可以为用户提供微软office软件一样的在线文档编辑服务.它不需要安装任何形式的客户端,兼容绝大多数主流浏览器, ...

  7. FCKEditor使用说明

    1.基本设置   先看看效果是什么样的:   效果图: 那么为什么说是FCKeditor的冰冷之心呢?这不是哗众取宠,主要是说它使用起来有点麻烦,下文就详细说明如何搞定这玩意儿. 1.FCKedito ...

  8. HTML编辑器UEditor的简单使用

    參考自:http://ueditor.baidu.com/website/document.html 关于HTML编辑器,试过FCKeditor,升级版的CKeditor,还有TinyMCE,近期在尝 ...

  9. FCKeditor 插件开发 示例

    (FCKeditor.地址是:http://www.fckeditor.net/.我下载的版本是:2.6.3.)What ?FCKeditor一直是web上编辑器的比较好的一个选择,他是开源的,而且效 ...

随机推荐

  1. 编译安装开源免费中文分词scws

    一.SCWS了解一下: SCWS 是 Simple Chinese Word Segmentation 的首字母缩写(即:简易中文分词系统). 这是一套基于词频词典的机械式中文分词引擎,它能将一整段的 ...

  2. Vue项目中使用vw实现移动端适配

    我们在vue移动端项目中的适配一般都采用rem,但是rem也不是能兼容所有的终端. 随着viewport单位越来越受到众多浏览器的支持,下面将简单介绍怎么实现vw的兼容问题,用vw代替rem 当我们采 ...

  3. 在python中安装basemap

    在python中安装basemap 1. 确保python环境安装完毕且已配置好环境变量 2. 安装geos: pip install geos 3. 下载.whl文件: (1)pyproj‑1.9. ...

  4. PublicCMS 网站漏洞 任意文件写入并可提权服务器权限

    PublicCMS是目前网站系统中第一个采用JAVA架构 TOMCAT+Apcche+Mysql数据库架构的CMS网站,开源,数据承载量大,可以承载到上千万的数据量,以及用户的网站并发可达到上千万的P ...

  5. python爬取豆瓣流浪地球影评，生成词云

    代码很简单,一看就懂. (没有模拟点击,所以都是未展开的) 地址: https://movie.douban.com/subject/26266893/reviews?rating=&star ...

  6. Go web表单验证

    开发Web的一个原则就是,不能信任用户输入的任何信息,所以验证和过滤用户的输入信息就变得非常重要 必填字段 if len(r.Form["username"][0])==0{ // ...

  7. 快速傅里叶变换（FFT）学习笔记（未完待续）

    目录 参考资料 FFT 吹水 例题 普通做法 更高大尚的做法 定义与一部分性质 系数表达式 点值表达式 点值相乘??? 卷积 复数 单位根 DFT IDFT 蝴蝶迭代优化 单位根求法 实现.细节与小优 ...

  8. [JSOI2007] 建筑抢修 (贪心 + 优先队列)

    小刚在玩JSOI提供的一个称之为“建筑抢修”的电脑游戏:经过了一场激烈的战斗,T部落消灭了所有z部落的入侵者.但是T部落的基地里已经有N个建筑设施受到了严重的损伤,如果不尽快修复的话,这些建筑设施将会 ...

  9. Java——static关键字---18.09.27

    static表示“全局”或者“静态”的意思,用来修饰成员变量和成员方法,也可以形成静态static代码块,但在Java语言中没有全局变量的概念. static关键字主要有两种作用: 一.为某特定数据类 ...

  10. Hbase读写流程和寻址机制

    写操作流程 (1) Client通过Zookeeper的调度,向RegionServer发出写数据请求,在Region中写数据. (2) 数据被写入Region的MemStore,直到MemStore ...