由于最近在架构一个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. .NET Core2.0 MVC中使用EF访问数据

    使用环境:Win7+VS2017 一.新建一个.NET Core2.0的MVC项目 二.使用Nuget添加EF的依赖 输入命令:Install-Package Microsoft.EntityFram ...

  2. NET .NET深入体验和实战精要

    在学习.NET之前要充分理解基础,在这里将基础的知识点一一列举. 万丈高楼平地起 1.命名空间 命名空间是一种特殊的分类机制,他将与一个特定功能集有关的所有类型都分到一起,是.避免类名冲突的一种方式 ...

  3. MQ、JMS以及ActiveMQ 关系的理解

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt127 Best-text mb-10代码 ms 的一个标准或者说是一个协议. ...

  4. Mycat 设置全局序列号

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt332 全局序列号介绍 在实现分库分表的情况下,数据库自增主键已无法保证自增主 ...

  5. Singleton(单例)模式

    Singleton(单例)模式:保证一个类仅有一个实例,并提供一个访问它的全局访问点. public class Singleton { private static Singleton ourIns ...

  6. 美国站群服务器有利于SEO优化

    美国服务器对于站群来说就是指站长为提升每个网站对搜索引擎的权重,更好的有利于seo优化,单独为该服务器下的多个网站分别配置不同的独立ip. 实际上,站群服务器跟其他服务器并没有多大差异,唯一的区别就是 ...

  7. IPv4子网掩码回顾

    子网掩码的介绍: IP协议标准规定:每一个使用子网的节点都选择一个32位的位模式,若位模式中的某位置为1,则对应IP地址中的某位就为网络地址(包括网络部分和子网号)中的一位:若位模式中的某位置0,则对 ...

  8. 2016-2017-2 《Java 程序设计》课堂实践项目

    目录 基本工具 基础内容 Hello World 和 模块分解 数组的使用 命令行参数 递归 分支语句 String类的使用 类的定义与测试 多态 IO与异常 数据库 网络与安全 数据结构应用 And ...

  9. 结对编程1-四则运算(基于GUI)

    林晓芳201421123092.陈惠201421123096 coding 地址:https://git.coding.net/lianlian/92.96.1.git 一.题目描述 我们在个人作业1 ...

  10. 201521123063 《Java程序设计》第13周学习总结

    1. 本周学习总结 以你喜欢的方式(思维导图.OneNote或其他)归纳总结多网络相关内容. 网络通讯的两种方式 TCP方式:类似于打电话,能够建立专门的虚拟连接,数据传输可靠 UDP方式:类似与发短 ...