富文本编辑器 kindeditor的使用_kindeditor 后台获取-优快云博客

本文链接：https://blog.youkuaiyun.com/chenzhenguo123/article/details/52584559

本文介绍如何在网页中引入并配置KindEditor富文本编辑器，包括设置编辑器的基本属性，如宽度、高度等，并定义了允许上传图片、浏览服务器文件等功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

引入js

<script type="text/javascript" src="${pageContext.request.contextPath}/js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/kindeditor-4.1.10/lang/zh_CN.js"></script>

js代码

<script type="text/javascript">

//编辑器
var options={
	uploadJson: '${pageContext.request.contextPath}/information/addInformation.shtml',
	fileManagerJson : '/ckEditorUploadFile',
	allowFileManager : true, // 是否允许上传本地图片
	allowFileManager: true,  // 是否允许浏览服务器已上传文件
	allowFlashUpload:false, // 是否允许上传Flash(默认)
	allowMediaUpload:false, // 是否允许上传多媒体文件(默认)
	width: "96%", //编辑器的宽度为100%
	height: "400px", //编辑器的高度为100px
	filterMode: false, //不会过滤HTML代码
	resizeMode: 1,//编辑器只能调整高度 
	items : [
	         'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',
	         'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
	         'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
	         'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
	         'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
	         'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 
	          '|' ,'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
	         'anchor', 'link', 'unlink', '|', 'about','audio'
		  	]
	};
KindEditor.ready(function(K) {
	editor = K.create('textarea[name="contents"]',options);
	
});
KindEditor.sync();

    
    
    
    
    
 </script>

内容：

 <textarea id="contents" name="contents" style="width:98%; height:185px;visibility:hidden;">

              </textarea>

所需的js

http://share.weiyun.com/07569bb5dc39a79d2c4813e2f26b5085