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

实现方法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. 4.几个「不难但却很有用」的 Git 技能点

    阅读 Git 原理详解及实用指南 记录 tag:不可移动的 branch tag 是一个和 branch 非常相似的概念,它和 branch 最大的区别是:tag 不能移动.所以在很多团队中,tag ...

  2. 内存管理(malloc和free的用法)

    内存管理 1.堆和栈的区别: 1>栈的特征 1).执行的速度相对较快: 2).空间较小: 3).生存期由系统决定: 4).作用域较小: 5).有名空间,可以通过变量名或者数据名访问: 2> ...

  3. [LeetCode] 887. Super Egg Drop 超级鸡蛋掉落

    You are given K eggs, and you have access to a building with N floors from 1 to N.  Each egg is iden ...

  4. IDEA git commit push revert

    Revert uncommitted changes You can always undo the changes you've done locally before you have commi ...

  5. scrapy——4 —反爬措施—logging—重要参数—POST请求发送实战

    scrapy——4 常用的反爬虫策略有哪些 怎样使用logging设置 Resquest/Response重要参数有哪些 Scrapy怎么发送POST请求 动态的设置User-Agent(随即切换Us ...

  6. Android第三方开源图片裁剪截取:cropper

     Android第三方开源图片裁剪截取:cropper 很多app都需要裁剪截取图片作为头像.logo之类,而cropper是github上的一个针对Android平台的.第三方开源图片裁剪截取项 ...

  7. python在Linux中安装虚拟环境,区别python2和python3,分别安装模块

    安装虚拟环境的时候遇到的问题,解决的过程很闹心,在这里简单直接的分享出来,就是为了解决问题.  安装虚拟环境(须在联网状态下) $ sudo pip install virtualenv $ sudo ...

  8. pg 学习资料

    文/谭峰 DBA,PostgreSQL专家 开源数据库 PostgreSQL 中文资料非常缺乏,很多社区朋友苦于上手的中文资料少,因此汇总收集以下 PostgreSQL 中文资料,包括 Postgre ...

  9. python getaddrinfo 函数

    现在python中用到的关于地址查询的函数几乎都可以用getaddrinfo. 也就是说,如果你要想做一些与地址查询,主机名ip转换的操作,都可以用这个函数,下面看一下这个函数. 首先,我们可以用ge ...

  10. JS 缓冲运动 带运动的留言本 小案例

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