引用
<script src="https://cdn.jsdelivr.net/gh/kindsoft/kindeditor/kindeditor-all-min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/kindsoft/kindeditor/lang/zh-CN.js"></script>
HTML
<textarea id="editor_id" name="content"></textarea>
示例
<script type="text/javascript">
KindEditor.ready(function(K) {
window.editor = K.create('#editor_id');
});
</script>
自定义插件 save
保存按钮
设置 items
项
window.editor = K.create('#editor_id', {
items : [
'save', '|', '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', '|',
'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
'anchor', 'link', 'unlink', '|', 'about', '|', 'fullscreen', '|',
],
});
鼠标移动上面显示语言用 KindEditor.lang
设置
KindEditor.lang({
save : '保存'
});
设置风格图片
.ke-icon-save {
background-image: url(save.jpg);
width: 16px;
height: 16px;
}
添加点击事件代码
KindEditor.plugin('save', function(K) {
var self = this, name = 'save';
self.clickToolbar(name, function() {
// 点击执行
});
});
自适应容器宽度、高度
在 create
的时候设置容器宽度和高度,然后添加 window.onresize
事件
window.onresize = function() {
window.editor.resize("100%", document.height);
}
常用函数
html() 取得编辑器的HTML内容。
html(val) 设置编辑器的HTML内容。
text() 取得编辑器的纯文本内容。(包含img和embed)
text(val) 设置编辑器的内容,直接显示HTML代码。
remove() 移除编辑器。