由于最近在架构一个pc端b/s结构的项目,项目中有个论坛模块,当用户发帖时,需要用到富文本编辑器,考虑了一下,决定使用CKEditor富文本编辑器,虽然现在问世的富文本编辑器很丰富,比如还有百度的UEditor等等,但是我选择使用CKEditor的原因是它能快速引入到我的项目中去。马上附上详细步骤:

(1).工具准备,下载CKEditor:http://ckeditor.com/download(我的项目下载使用的是标准版本:ckeditor_4.7.1_standard)
(2).部署到自己项目的详细步骤:
在WebContent目录下新建用来存放解压后的所有文件的目录,目录名就叫 "ckeditor",

复制解压的所有文件到新建的ckeditor目录下,


引入ckeditor.js和config.js文件到jsp页面头部,


在要转换成富文本的textarea下方编写js代码如下:
<script type="text/javascript">CKEDITOR.replace('textarea的name');</script>


另外可以在config.js文件中进行自定义属性设置:

最后,刷新页面,一个好看的富文本编辑器就呈现出来了,大功告成!!!

富文本编辑器CKEditor的使用的更多相关文章

  1. MVC5富文本编辑器CKEditor配置CKFinder

    富文本编辑器CKEditor的使用 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: ...

  2. 富文本编辑器 CKeditor 配置使用+上传图片

    参考文献: 富文本编辑器 CKeditor 配置使用 CKEditor与CKFinder的配置(ASP.NET环境),老版本可以参考 CKEditor+CKFinder ASP版在本地电脑中的配置  ...

  3. 富文本编辑器CKEDITOR的使用配置(问题注解)

    CKEDITOR是一款非常轻便的富文本编辑器,如上图:参考网上的使用方法,我以.net为例,在aspx页面使用, 准备工作:首先要下载控件包,将解压后的整个文件夹添加到项目根目录. 第一步:引用js, ...

  4. 富文本编辑器 CKeditor 配置使用 (带附件)

    Ckeditor下载地址:http://ckeditor.com/download 1.CKeditor的基本配置 var textval=CKEDITOR.instances.TextArea1.g ...

  5. 富文本编辑器CKeditor的配置和图片上传,看完不后悔

    CKeditor是一款富文本编辑器,本文将用极为简单的方式介绍一下它的使用和困扰大家很久的图片上传问题,要有耐心. 第一步:如何使用 1.官网下载https://ckeditor.com/ckedit ...

  6. 富文本编辑器ckeditor继承

    新建一个web项目ckfinder,导入lib包 加入java包,编码格式UTF-8 在WebRoot下添加ckedtior以及ckfinder两个文件夹,将config.xml拷入WEB-INF中 ...

  7. 富文本编辑器 CKeditor 配置使用

    作者:Tyler Ning出处:http://www.cnblogs.com/tylerdonet/本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连 ...

  8. CKEditor富文本编辑器

    CKEditor 富文本即具备丰富样式格式的文本.在运营后台,运营人员需要录入课程的相关描述,可以是包含了HTML语法格式的字符串.为了快速简单的让用户能够在页面中编辑带格式的文本,我们引入富文本编辑 ...

  9. django中ckeditor富文本编辑器使用

    1.安装模块 (pillow是python的一个图像处理库) pip install django-ckeditor pip install pillow 2.编辑seetings.py配置文件 IN ...

随机推荐

  1. JavaScript在应用中的技巧(二)

    ==,===运算符和强制转换 先看个表达式: "1.0e0" == { valueOf: function() { return true; } }; 是的,这个结果可能有点出乎意 ...

  2. WCF(一)基础整理

    学习WCF之前,了解下WCF和WebService的区别. WCF和WebService区别 Web Service严格来说是行业标准,也就是Web Service 规范,它使用XML扩展标记语言来表 ...

  3. 再起航,我的学习笔记之JavaScript设计模式21(命令模式)

    命令模式 概念描述 命令模式(Command): 将请求与实现解耦并封装成独立的对象,从而使不同的请求对客户端的实现参数化 示例代码 命令模式我们可以看成是将创建模块的逻辑封装在一个对象里,这个对象提 ...

  4. 转: 【Java并发编程】之二十:并发新特性—Lock锁和条件变量(含代码)

    简单使用Lock锁 Java5中引入了新的锁机制--Java.util.concurrent.locks中的显式的互斥锁:Lock接口,它提供了比synchronized更加广泛的锁定操作.Lock接 ...

  5. 【C++】关于pow函数的用法

    在C++中,pow有多个重载函数: 在dev中,pow(int,int)可以执行,但是在别的地方是不可以被编译的:会提示 :error C2668: “pow”: 对重载函数的调用不明确 可以看见,是 ...

  6. Swing-JComboBox用法-入门

    JComboBox是Swing中的下拉菜单控件.它永远只能选中一个项目,然而比单选按钮节省空间.如果使用setEditable设置为true则内部选项的文本可以编辑,因此这种组件被称为组合框.注意,对 ...

  7. Swing-JCheckBox用法-入门

    JCheckBox是Swing中的复选框.所谓复选框就是指,可以同时存在多个这样的控件,它们可以有多个处于被选中状态.对于每一个复选框而言,它只有选中和未选中两种状态. JCheckBox的常用方法如 ...

  8. 201521123005 《Java程序设计》第1周学习总结

    1. 本章学习总结 了解JDK/JRE/JVM,学会了如何安装JDK 学会使用控制台和eclipse上运行java代码 了解PTA提交的常见套路 http://www.cnblogs.com/zhrb ...

  9. 201521123054 《Java程序设计》第11周学习总结

    1. 本周学习总结 2. 书面作业 1.1 除了使用synchronized修饰方法实现互斥同步访问,还有什么办法实现互斥同步访问(请出现相关代码)? 使用Lock对象和Condition对象实现互斥 ...

  10. 201521123074 《Java程序设计》第14周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 2. 书面作业 Q1. MySQL数据库基本操作 建立数据库,将自己的姓名.学号作为一条记录插入.(截图,需出现 ...