ExtJs 集成kindeditor

来源:互联网 发布:泉州数据分析培训 编辑:程序博客网 时间:2024/06/05 15:35

首先需要引入 kindeditor类

 // 引入 extjs

<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script language="javascript" src="ext/ext-all.js"></script>
<script language="javascript" src="ext/ext-lang-zh_CN.js"></script>

// 引入 kindeditor

<script type="text/javascript" src="kindeditor/kindeditor-min.js"></script>  
 <script type="text/javascript" src="kindeditor/lang/zh_CN.js"></script>

 

在需要出现编辑器的地方加入如下js代码:

 

         {             xtype: 'textareafield',             region: 'center',             name: 'content',             id: 'content',             anchor: '90%',             height: '100%',             listeners: {                 'render': function (f) {                     setTimeout(function () {                         if (KindEditor) {                             Nceditor = KindEditor.create('#content-inputEl', {                                 cssPath: 'kindeditor/plugins/code/prettify.css',                                 resizeType: 1,                                 resizeMode: 0,                                 allowFileManager: true                             });                         }                     }, 500);                 }             }         }

以下是操作存取编辑内容:

Nceditor.html(cont);   //给编辑区域加载内容

 Nceditor.edit.setHeight('200px');  // 动态修改编辑区域高度

var cont = Nceditor.html();  // 获取编辑区域内容

以下是实际使用效果图:

 

 

 

1 0
原创粉丝点击