ASP.NET 文字编辑控件 KindEditor使用方法

最新推荐文章于 2018-11-12 08:02:11 发布

wlc_win

最新推荐文章于 2018-11-12 08:02:11 发布

阅读量2.5k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： ASP.NET kindeditor 文章标签： asp.net function stylesheet 脚本 manager jsp

本文链接：https://blog.youkuaiyun.com/wlc_win/article/details/7058243

ASP.NET 同时被 2 个专栏收录

5 篇文章

订阅专栏

kindeditor

1 篇文章

订阅专栏

本文介绍KindEditor富文本编辑器的简易两步配置方法，包括页面代码引用及JavaScript脚本配置，帮助开发者轻松实现富文本编辑功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

KindEditor 的使用方法让人看的有点玄乎

自己结合网上经验探索了一下，发现两步就可以：

准备工作：下载安装包，解压，去掉ASP,PHP,JSP等没用的文件。

将它放入项目中。

第一步：页面代码

（1）引用（按照官方说明）

<textarea id="content" name="content" style="width:700px;height:300px;">
<strong>HTML内容</strong>
</textarea>

第二步：该页面JS（如使用母版页，在其页面的content1里加入即可，注意KindEditor的id号不要与content1重复），其实是demo的js脚本。

<link rel="stylesheet" href="../../editor/themes/default/default.css" />
	<script charset="utf-8" src="../../editor/kindeditor.js"></script>
	<script charset="utf-8" src="../../editor/lang/zh_CN.js"></script>
	<script charset="utf-8" src="../../editor/plugins/code/prettify.js"></script>
	<script>
		KindEditor.ready(function(K) {
			var editor1 = K.create('#content', {
				cssPath : '../../editor/plugins/code/prettify.css',
				uploadJson : '../../editor/asp.net/upload_json.ashx',
				fileManagerJson : '../../editor/asp.net/file_manager_json.ashx',
				allowFileManager : true,
				afterCreate : function() {
					var self = this;
					K.ctrl(document, 13, function() {
						self.sync();
						K('form[name=example]')[0].submit();
					});
					K.ctrl(self.edit.doc, 13, function() {
						self.sync();
						K('form[name=example]')[0].submit();
					});
				}
			});
			prettyPrint();
		});
	</script>

注意这里我修改了几个地方，为的是页面能够找到脚本。用如果写在母版页里的话注意相对路径是生成完后的页面相对脚本的地址，也就是跟写在子页里是一样的。

至此完成。

还不知道有什么缺点哦。