大致效果图(对其中的功能可以增减):

实现方法1:调用js
<link href="../../platform/js/kindeditor/themes/default/default.css" rel="stylesheet" rel="stylesheet"/>
<link href="../../platform/js/kindeditor/plugins/code/prettify.css" rel="stylesheet" rel="stylesheet"/> <script charset="utf-8" src="../../platform/js/kindeditor/kindeditor-all.js"></script>
<script charset="utf-8" src="../../platform/js/kindeditor/lang/zh-CN.js"></script>
<script charset="utf-8" src="../../platform/js/kindeditor/plugins/code/prettify.js"></script> <script type="text/javascript">
$(function() {
KindEditor.ready(function(K) {
var editor1 = K.create('textarea[name="articleContent"]', {
width : '100%',
height : '450px',
       //上传图片,保存图片的方法
uploadJson : 'editorUpload.do?folderType=gongGao',
allowFileManager : true,
afterBlur: function () {
this.sync();
}
});
});
});
</script> 文章内容:<textarea id="articleContent" name="articleContent" class="ckeditor">${cmsArticle.articleContent}</textarea>
实现方法二:调用js
<script src="../../platform/js/ckeditor/ckeditor.js"></script> <script type="text/javascript">
$(function() {
CKEDITOR.replace($("#articleContent")[],
{
toolbar : [
[ 'Bold', 'Italic', 'Underline', 'Subscript', 'Superscript', '-', 'RemoveFormat' ],
[ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ],
[ 'Image', 'Format', 'Font', 'FontSize', 'TextColor', 'BGColor' ] ],
filebrowserUploadUrl : 'ckeditorUpload.do?folderType=gongGao&fileType=file',//上传附件
filebrowserImageUploadUrl : 'ckeditorUpload.do?folderType=gongGao&fileType=file',//上传图片
language : 'zh-cn',
width : '100%',
height : '600px'
});
});
</script> 文章内容:<textarea id="articleContent" name="articleContent" class="ckeditor">${cmsArticle.articleContent}</textarea>

页面中word文本框的编辑,两种方式的更多相关文章

  1. Android中H5和Native交互的两种方式

    Android中H5和Native交互的两种方式:http://www.jianshu.com/p/bcb5d8582d92 注意事项: 1.android给h5页面注入一个对象(WZApp),这个对 ...

  2. python中字典的循环遍历的两种方式

    开发中经常会用到对于字典.列表等数据的循环遍历,但是python中对于字典的遍历对于很多初学者来讲非常陌生,今天就来讲一下python中字典的循环遍历的两种方式. 注意: python2和python ...

  3. C语言中存储多个字符串的两种方式

    C语言中存储多个字符串的两种方式 方式一    二维字符串数组 声明: char name[][] = { "Justinian", "Momo", " ...

  4. Jsp页面中使用fckeditor控件的两种方法 [转]

    fckeditor控件请到官方网站下载http://www.fckeditor.net,本例主要用到FCKeditor_2.6.3.zip.fckeditor-java-demo-2.4.1.zip. ...

  5. 在基于MVC的Web项目中使用Web API和直接连接两种方式混合式接入

    在我之前介绍的混合式开发框架中,其界面是基于Winform的实现方式,后台使用Web API.WCF服务以及直接连接数据库的几种方式混合式接入,在Web项目中我们也可以采用这种方式实现混合式的接入方式 ...

  6. java中读取配置文件ResourceBundle和Properties两种方式比较

    今天在开发的时候,需要把一些信息放到配置文件中,方便后续的修改,注意到用的是ResourceBundle读取配置文件的方式,记得之前也见过使用Properties的方式,就比较好奇这两种方式的区别,网 ...

  7. 程序中使用log4J打印信息的两种方式

    (1)通过org.apache.commons.logging.Log 接口实例化: public static Log log = LogFactory.getLog(String name); p ...

  8. html和jsp页面中把文本框禁用,只能读不能写的方法

    方法常用有三种: 第一种,使用   onfocus="this.blur()" <input name="deptno" type="text& ...

  9. web页面中快速找到html对应元素两种方法

    一.第一种方法(通过先进入开发模式然后再去选择网页元素) 1.打开IE.Chrome.FireFox等,按 F12 键进入开发模式 2.在打开的控制窗口左上角有个  箭头 按钮,点击它之后,此时将鼠标 ...

随机推荐

  1. 爬虫之cookie

    什么是cookie: 在网站中,http请求是无状态的.也就是说即使第一次和服务器连接后并且登录成功后,第二次请求服务器依然不能知道当前请求是哪个用户.cookie的出现就是为了解决这个问题,第一次登 ...

  2. Git下的标签

    发布一个版本时,我们通常先在版本库中打一个标签(tag),这样,就唯一确定了打标签时刻的版本.将来无论什么时候,取某个标签的版本,就是把那个打标签的时刻的历史版本取出来.所以,标签也是版本库的一个快照 ...

  3. HTML的基本操作学习----常用标签,特殊符号,列表,表格,表单

    什么是HTML 常用标签 标题标签 段落标签 粗体标签+斜体 超链接标签 图片标签 列表标签 无序标签 有序标签 自定义列表 div标签 特殊符号 表格 表单 HTML 什么是 HTML?   HTM ...

  4. 【LeetCode Weekly Contest 26 Q2】Longest Uncommon Subsequence II

    [题目链接]:https://leetcode.com/contest/leetcode-weekly-contest-26/problems/longest-uncommon-subsequence ...

  5. [BZOJ1031][JSOI2007]字符加密Cipher(后缀数组)

    传送门 算是个模板. 题目说循环,那就再复制一串拼接上. 然后求后缀数组,再搞就可以. 虽然是求后缀,会在后面多一些字符串,然而题目中说的是循环一圈,但是没有影响. ——代码 #include < ...

  6. Java 学习(7):java 日期时间 & 正则表达式

    目录 --- 日期时间 --- 正则表达式 日期时间:java.util 包提供了 Date 类来封装当前的日期和时间. Date 类提供两个构造函数来实例化 Date 对象. 构造函数:用于初始化对 ...

  7. BZOJ——T 1801: [Ahoi2009]chess 中国象棋

    http://www.lydsy.com/JudgeOnline/problem.php?id=1801 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit:  ...

  8. springMvc--接受日期类型参数处理

    这个问题,也即是springMvc如何进行参数类型的转换 , 以把client传过来一个String类型,转换为日期类型为例 步骤 1.controller /** * 接收日期类型参数 * 注意: ...

  9. firedac数据集和字符串相互转换

    uses Data.FireDACJSONReflect 1)FIREDAC数据库序列为字符串,进行了加压和BASE64编码 function DataSetToString(const ADataS ...

  10. poj 3468 A Simple Problem with Integers(线段树+区间更新+区间求和)

    题目链接:id=3468http://">http://poj.org/problem? id=3468 A Simple Problem with Integers Time Lim ...