KingEditor富⽂本编辑器的使⽤
1、KingEditor相关js、css⽂件资源位置:
链接:
提取码:p64n
2、使⽤步骤:
a).在页⾯引⼊相关资源
<link rel="stylesheet" href="../plugins/kindeditor/themes/default/default.css" />
<script charset="utf-8" src="../plugins/kindeditor/kindeditor-min.js"></script>
<script charset="utf-8" src="../plugins/kindeditor/lang/zh_CN.js"></script>
b).初始化⼀个kingEditor对象
<script type="text/javascript">
var editor;
editor = K.create('textarea[name="content"]', {
allowFileManager : true --这个表⽰是否允许浏览服务器已上传的⽂件,默认是false,这⾥可以配置多个,⽤逗号隔开 });
});
</script>
c).提取内容:editor.html();
d).清空内容:editor.html(’’);
3、初始化kingeditor对象时可以配置的属性列表:
allowFileManager 【是否允许浏览服务器已上传⽂件】
默认值是:false
------------------------------------------------------
allowImageUpload 【是否允许上传本地图⽚】
默认值是:true
----------------------------------------------
allowFlashUpload 【是否允许上传Flash】
默认值是:true
----------------------------------------------
allowMediaUpload 【是否允许上传多媒体⽂件】
默认值是:true
------------------------------------------------
pasteType 【设置粘贴类型】
0:禁⽌粘贴, 1:纯⽂本粘贴, 2:HTML粘贴(默认)
---------------------------------------------------
resizeType 【设置可否改变编辑器⼤⼩】
0:不能改变 1:只能改变⾼度 2:宽度和⾼度都可以改变(默认)
----------------------------------------------------------
themeType 【主题风格】
可设置"default"、"simple",指定simple时需要引⼊simple.css
-------------------------------------------------------------
designMode 【可视化模式或代码模式】
数据类型:Boolean
默认值是:true(可视化)
-
-----------------------------------------
afterCreate:function(){} 【编辑器创建后】
afterCreate:function(){
afterCreate:function(){
//alert('创建完成');
}
------------------------------------------
fontSizeTable 【制定⽂字⼤⼩】
数据类型:Array
默认值:['9px', '10px', '12px', '14px', '16px', '18px', '24px', '32px']
----------------------------------------------------------------------- colorTable 【指定取⾊器⾥的颜⾊值】
数据类型:Array
[
['#E53333', '#E56600', '#FF9900', '#64451D', '#DFC5A4', '#FFE500'], ['#009900', '#006600', '#99BB00', '#B8D100', '#60D978', '#00D5FF'], ['#337FE5', '#003399', '#4C33E5', '#9933E5', '#CC33E5', '#EE33EE'], ['#FFFFFF', '#CCCCCC', '#999999', '#666666', '#333333', '#000000'] ]
上⾯是默认值
---------------------------------------------------------------------------------- 【Ctrl+Enter提交】
afterCreate:function(){
var self=this;
self.sync();
//执⾏其他事件
});
}
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
var ate('#nr');
【编辑器获取焦点】
asp富文本编辑器editor.focus();
【取得编辑器HTML内容】
var html=editor.html();
【取得编辑器纯⽂本内容】
var ();
【移除编辑器】
【设置编辑器HTML】
editor.html('<strong>编辑器内容</strong>');
【设置编辑器纯⽂本内容,直接显⽰HTML代码】
<('<strong>编辑器内容</strong>');
【判断编辑器内容是否为空】
if(editor.isEmpty()){
alert('请输⼊内容');
return false;
}
【将指定的HTML内容插⼊到编辑器区域⾥的光标处】
editor.insertHtml('<strong>插⼊内容</strong>');
【将指定的HTML内容添加到编辑器区域的最后位置。】
editor.appendHtml('<strong>追加内容</strong>');
【编辑器切换全屏模式】
editor.fullscreen();
【设置编辑器的只读状态】
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论