首先需要进入官网下载kineditor相关文件:

然后写代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="kindeditor/themes/default/default.css" />
<script charset="UTF-8" src="kindeditor/kindeditor-all-min.js"></script>
<script charset="UTF-8" src="kindeditor/lang/zh_CN.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<title></title>
</head>
<body>
<form>
<textarea name="content" style="width:800px;height:200px;"></textarea> </form>
<button id="a">aaaaaaaaaa</button>
</body>
<script>
var editor;
KindEditor.ready(function(K) {
editor = K.create('textarea[name="content"]', {
allowFileManager : true
});
});
$(function(){
$("#a").click(function(){
alert(editor.html());
})
});
</script>
</html>

测试结果:

还有其他的方法可以参考源码页:

<html>
<head>
<meta charset="utf-8" />
<title>Default Examples</title>
<style>
form {
margin: ;
}
textarea {
display: block;
}
</style>
<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>
<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>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-7116729301372758";
/* 更多演示(728x90) */
google_ad_slot = "";
google_ad_width = ;
google_ad_height = ;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<h3>默认模式</h3>
<form>
<textarea name="content" style="width:800px;height:400px;visibility:hidden;">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>
</html>

kindedtor的基本使用的更多相关文章

  1. kindedtor 数据传输问题

    <script src="/static/kindeditor/kindeditor-all.js"></script><script src=&qu ...

  2. 在线编辑器的使用总结(kindeditor , )

    1).kindedtor中让编辑框默认为“HTML代码/源代码”模式 [javascript] view plaincopyprint? <script> // 自定义插件 #1 Kind ...

  3. NopCommerce 3.80框架研究(三)替换tinymce 为KindEditor

    NopCommerce 自带的编辑器tinymce 功能不是很全.所以尝试将其替换为功能更强大的 KindEditor 并替实现文件上传和在线浏览功能 首先下载 并解压到如下位置 请注意这里是部署在N ...

随机推荐

  1. debian7 安装VMware Tools

    前提:需要安装gcc.kernel 1. apt-get install gcc 2. apt-get install kernel 问题描述: 安装时如果提示更换介质 :请把标有 " de ...

  2. [hdu4333]Revolving Digits

    /*注意注意:本题非hdu4333原题,而是简化版,原版有多组数据.但此代码在修改输入后依旧可以通过多组数据*/ 给出一个数字串,问有多少本质不同同构串比原串小,一样,大.同构串是指,对于原串S[1- ...

  3. scrapy-redis源码抛析

    #scrapy-redis--->queue.py-->class FifoQueue 队列 LifoQueue(lastinfirstout栈) #self.server父类Base中链 ...

  4. ffmpeg: ‘UINT64_C’ was not declared in this scope (转)

    ffmpeg 默认是用C文件来编译的,如果某个CPP文件想引用ffmpeg中的某些函数或者头文件,有可能出现 ‘UINT64_C’ was not declared in this scope的错误 ...

  5. CORS实现跨域Ajax

    客户端 #!/usr/bin/env python import tornado.ioloop import tornado.web class MainHandler(tornado.web.Req ...

  6. js语法和数据类型

    基础知识(Basics) JavaScript 的很多语法借鉴自 Java,但也受 Awk,Perl 和 Python 影响. JavaScript 是大小写敏感的,使用 Unicode 字符集. 在 ...

  7. php 关于锁的一些看法

    背景:在一个项目中,需要一次对数据很复杂的计算,其中一次计算需要花费大概30秒钟时间,大概需要查询一个比较大的表300次左右,然后还需要进行查询7-8次数据库,然后进行组合排序等功能,完成最终结果.对 ...

  8. Configuration File (php.ini) Path Loaded Configuration File 都有加载php.ini文件,有什么不同的地方?

    Configuration File (php.ini) Path /usr/local/php7/etc      这个目录下面也有php.ini文件(如果在编译./configure -with- ...

  9. CF702E Analysis of Pathes in Functional Graph

    倍增练习题. 基环树上倍增一下维护维护最小值和权值和,注意循环的时候$j$这维作为状态要放在外层循环,平时在树上做的时候一个一个结点处理并不会错,因为之前访问的结点已经全部处理过了. 时间复杂度$O( ...

  10. 4.传统的MVC

    通过document view设计,我们把应用程序的状态(clicktimes)从一个简单的类设计中抽取出来.下一个目标是抽取转化主要的事件(这个例子里面是鼠标点击之后释放)为应用程序逻辑从而改变应用 ...