kindeditor用法简介

kindeditor用法简介kindeditor：作为一种文本编辑工具，比较受大家欢迎。和fckeditor差不多，个人感觉这个的皮肤更好看，而且对中文的支持更好，没那么容易出现中文乱码问题。下次记录一下自己的简单用法：

1，首先去官网下载http://www.kindsoft.net/

2，解压之后如图所示：![这里写图片描述](https://img-blog.csdn.net/20151105203630792)由于本人做的是用的是JSP，所以ASP,PHP什么的就用不上了，直接把那些去掉然后将整个文件夹扔进Myeclipse，如图：![这里写图片描述](https://img-blog.csdn.net/20151105203648026)里面有个报错，用不上没有影响，不用处理照常可以使用。3，就可以开工写JSP了，提供kindeditor在线编辑网站：http://kindeditor.net/demo.php这里面不止是可以在线编辑，同时还可以查看demo，案例，下载源码包等等。选取其中一个案例编程如下：

	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>Default Examples</title>
	<style>
	form {
	margin: 0;
	}
	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 = "5052271949";
	google_ad_width = 728;
	google_ad_height = 90;
	//-->
	</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>

4，界面如下所示：可以看到kindeditor-min.js实现了许多类似于QQ邮箱中的编辑工具，方便程序员的开发。感兴趣的童鞋可以去官网看看。

5，关于数据库和上传本地图片问题Kindeditor对于上传的图片神马的会默认保存在attached文件夹中，至于数据库字段中存储的只是图片的地址，所以将内容读取出来的时候，只要读取数据库字段中的内容就会自动将文本和图片等一起显示出来了，很好很强大！要注意的就是读取数据库出来之后要将地址转换成HTML代码才能正确显示，这个工作很简单，只要：<s:propertyvalue="article.content1"escape="false"/>将escape="false" 就OK了。

kindeditor用法简介相关推荐

MSSQL Sql加密函数　hashbytes 用法简介
原文:MSSQL Sql加密函数 hashbytes 用法简介转自:http://www.maomao365.com/?p=4732 一.mssql sql hashbytes 函数简介 hashb ...
Postman用法简介-Http请求模拟工具
Postman用法简介-Http请求模拟工具在我们平时开发中,特别是需要与接口打交道时,无论是写接口还是用接口,拿到接口后肯定都得提前测试一下,这样的话就非常需要有一个比较给力的Http请求模拟工具 ...
InputStreamReader 和 OutputStreamWriter类用法简介，及演示。
InputStreamReader 和 OutputStreamWriter类用法简介. 一.InputStreamReader类 InputStreamReader 将字节流转换为字符流.是字节流通 ...
php中__FILE__常量用法简介
php中__FILE__常量用法简介 http://blog.csdn.net/xbei07/article/details/5616020#comments出处 1.php中的__FILE__常量返 ...
java test 用法,pytest基本用法简介
1.安装pytest,打开dos窗口输入: pip install pytest 2.通过pycharm工具下载 3.创建pytest测试用例步骤 # 定义测试类 class testdivide: ...
SAP Gateway与OData用法简介
本文将分别从基础原理和实际应用两个角度介绍SAP Gateway与OData相关的知识点. 1 相关的事务代码(t-code) SEGW - SAP Gateway Service Builder / ...
Matlab中 intlinprog函数用法简介
Matlab中 intlinprog函数用法简介本来想要自己亲手写一遍的,发现了一优质博文基本上跟我做过的例题大差不差,所以就直接放上链接. 参考链接 https://www.cnblogs.com ...
intersect的用法简介
intersect的用法简介在Oracle中,"A minus B"用于将结果集B中含有的记录从结果集A中移除,即用于获取存在于结果集A中而不存在于结果集B中的记录:" ...
Oracle SQL调优系列之no_unnest和unnest用法简介
Oracle调优之no_unnest和unnest用法简介本博客介绍Oracle SQL调优的一种常用也是很实用的方法,也即/*+no_unnest */和/*+ unnest*/,介绍Oracle ...
安装bwa软件linux,bwa软件用法简介
本文全文摘抄于简书:bwa软件用法简介仅用于方便个人学习,如有侵权,请提醒删除,谢谢 bwa 是一款将序列比对到参考基因组上的软件,包含了以下3种算法 BWA-backtrack BWA-SW BW ...

kindeditor用法简介

kindeditor用法简介相关推荐

最新文章

热门文章