由于最近在架构一个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. Springmvc_validation 效验器

    springmvc-validation效验器的使用介绍 对于任何一个应用来说,都会做数据的有效性效验,但是只在前端做并不是很安全,考虑到安全性這个时候会要求我们在服务端也对数据进行有效验证,spri ...

  2. memcache的原理和命中率的总结

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt267 1       Memcache是什么Memcache是danga.c ...

  3. 转：【Java并发编程】之七：使用synchronized获取互斥锁的几点说明

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/17199201     在并发编程中,多线程同时并发访问的资源叫做临界资源,当多个线程同时访 ...

  4. 微信小程序view标签以及display:flex的测试

    一:testview.wxml,testview.js自动生成示例代码 //testview.wxml <view class="section"> <view ...

  5. 201521123096《Java程序设计》第八周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 2. 书面作业 本次作业题集集合 1.List中指定元素的删除(题目4-1) 1.1 实验总结 实验中使用了s ...

  6. 201521123119《Java程序设计》第6周学习总结

    1. 本周学习总结 2. 书面作业 Q1.clone方法 Q1.1 Object对象中的clone方法是被protected修饰,在自定义的类中覆盖clone方法时需要注意什么? 只能在本类内部或者和 ...

  7. 201521123045 《Java程序设计》第6周学习总结

    Java 第六周总结 1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结.注1:关键词与内容不求多,但概念之间的 ...

  8. 201521123028 《Java程序设计》第5周学习总结

    1. 本周学习总结 2. 书面作业 Q1.代码阅读:Child压缩包内源代码 1.1 com.parent包中Child.java文件能否编译通过?哪句会出现错误?试改正该错误.并分析输出结果. Ch ...

  9. 201521123057 《Java程序设计》第12周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 1.字符流与文本文件:使用 PrintWriter(写),BufferedReader(读) ...

  10. java is-a、has-a和like-a、组合、聚合和继承 两组概念的区别

    is a 代表的是类之间的继承关系,比如PC机是计算机,工作站也是计算机.PC机和工作站是两种不同类型的计算机,但都继承了计算机的共同特性.因此在用 Java语言实现时,应该将PC机和工作站定义成两种 ...