1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > kindeditor富文本编辑器初步使用教程

kindeditor富文本编辑器初步使用教程

时间:2020-03-25 14:29:11

相关推荐

kindeditor富文本编辑器初步使用教程

下载kindeditor

可以选择去官网下载(/down.php),不过要翻墙;或者直接CSDN/download/dknightl/9813052

下载解压完放入自己的项目中

在解压完后可以删除不需要的文件夹,我是删除了asp、、jspphpexamples可以放到其他地方,用作代码参考。

初始化kindeditor富文本编辑器

首先先导入下面css和js文件

<link rel="stylesheet" href="../themes/default/default.css" /><script charset="utf-8" src="../kindeditor-min.js"></script><script charset="utf-8" src="../lang/zh_CN.js"></script>

然后初始化(textarea 为富文本编辑器主题,script代码初始化)

<textarea id="mul_input" name="content" style="width:700px;height:200px;visibility:hidden;display: block;">KindEditor</textarea> <script>//简单模式初始化var editor;KindEditor.ready(function(K) {editor = K.create('textarea[name="content"]', {resizeType : 1,allowPreviewEmoticons : false,allowImageUpload : false,items : ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline','removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist','insertunorderedlist', '|', 'emoticons', 'image', 'link']});});</script>

//默认模式<script>var editor;KindEditor.ready(function(K) {editor = K.create('textarea[name="content"]', {allowFileManager : true});K('input[name=getHtml]').click(function(e) {alert(editor.html());});K('input[name=isEmpty]').click(function(e) {alert(editor.isEmpty());});K('input[name=getText]').click(function(e) {alert(editor.text());});K('input[name=selectedHtml]').click(function(e) {alert(editor.selectedHtml());});K('input[name=setHtml]').click(function(e) {editor.html('<h3>Hello KindEditor</h3>');});K('input[name=setText]').click(function(e) {editor.text('<h3>Hello KindEditor</h3>');});K('input[name=insertHtml]').click(function(e) {editor.insertHtml('<strong>插入HTML</strong>');});K('input[name=appendHtml]').click(function(e) {editor.appendHtml('<strong>添加HTML</strong>');});K('input[name=clear]').click(function(e) {editor.html('');});});</script></head><body><h3>默认模式</h3><form style="margin: 0;"><textarea name="content" style="width:800px;height:400px;visibility:hidden;display: block;">KindEditor</textarea><p><input type="button" name="getHtml" value="取得HTML" /><input type="button" name="isEmpty" value="判断是否为空" /><input type="button" name="getText" value="取得文本(包含img,embed)" /><input type="button" name="selectedHtml" value="取得选中HTML" /><br /><br /><input type="button" name="setHtml" value="设置HTML" /><input type="button" name="setText" value="设置文本" /><input type="button" name="insertHtml" value="插入HTML" /><input type="button" name="appendHtml" value="添加HTML" /><input type="button" name="clear" value="清空内容" /><input type="reset" name="reset" value="Reset" /></p></form></body>

获得内容等方法可以参考API

/doc.php

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。