编辑器kindeditor 在Asp.net中的使用
2012-05-31 13:40
351 查看
本次分享给大家带来一个可视化编辑器(我以前用的版本是3.x的,现在更新到了4.X请朋友们用于4.x以上的,才可参考我的帮助文档)
KindEditor 是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果
开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。
KindEditor 使用 JavaScript 编写,可以无缝地与 Java、.NET、PHP、ASP 等程序集成,
比较适合在 CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用。-这不是我的介绍,是官方的
在众多可视化编辑器中,包括ckeditor与Fckeditor,我还是比较支持这个国产软件kindeditor
本网站的编辑器即是用kindeditor下载地址
版本不高不低4.0.5 (2012-01-15)
我发表过ckeditor与Fckeditor的帮助文档。包括本人的使用都感觉这个编辑器完全不适合人类使用。
繁重的加载。功能的缺陷。Debug的出现。兼容性的问题
入正题,无图无真相
用过其他编辑器的人都知道上面那些图标代表的每一个功能!
下载页面: http://www.kindsoft.net/down.php
文件介绍
3. 修改HTML页
在需要显示编辑器的位置添加textarea输入框。
id在当前页面必须是唯一的值。
在textarea里设置HTML内容即可实现编辑
在该HTML页面添加以下脚本。
KindEditor 是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果
开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。
KindEditor 使用 JavaScript 编写,可以无缝地与 Java、.NET、PHP、ASP 等程序集成,
比较适合在 CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用。-这不是我的介绍,是官方的
在众多可视化编辑器中,包括ckeditor与Fckeditor,我还是比较支持这个国产软件kindeditor
本网站的编辑器即是用kindeditor下载地址
版本不高不低4.0.5 (2012-01-15)
我发表过ckeditor与Fckeditor的帮助文档。包括本人的使用都感觉这个编辑器完全不适合人类使用。
繁重的加载。功能的缺陷。Debug的出现。兼容性的问题
入正题,无图无真相
用过其他编辑器的人都知道上面那些图标代表的每一个功能!
1. 下载编辑器
下载 KindEditor 最新版本,下载之后打开 examples/index.html 就可以看到演示。下载页面: http://www.kindsoft.net/down.php
2. 部署编辑器
解压 kindeditor-x.x.x.zip 文件,将所有文件上传到您的网站程序目录里,例如:http://您的域名/editor/文件介绍
您可以根据需求删除以下目录后上传到服务器。 asp - ASP程序 asp.net - ASP.NET程序 php - PHP程序 jsp - JSP程序 examples - 演示文件
3. 修改HTML页
在需要显示编辑器的位置添加textarea输入框。
<textarea id="editor_id" name="content" style="width:700px;height:300px;">HTML内容</textarea>
id在当前页面必须是唯一的值。
在textarea里设置HTML内容即可实现编辑
在该HTML页面添加以下脚本。
<script charset="utf-8" src="/editor/kindeditor.js"></script> <script charset="utf-8" src="/editor/lang/zh_CN.js"></script> var editor1; KindEditor.ready(function (K) { editor1 = K.create(#editor_id, { cssPath: /editor/kindeditor/plugins/code/prettify.css, uploadJson: /editor/kindeditor/asp.net/upload_json.ashx, fileManagerJson: /editor/kindeditor/asp.net/file_manager_json.ashx, allowFileManager: true }); prettyPrint(); });
4. 获取HTML数据
// 取得HTML内容 html = editor.html(); // 同步数据后可以直接取得textarea的value editor.sync(); html = document.getElementById(editor_id).value; // 原生API html = K(#editor_id).val(); // KindEditor Node API html = $(#editor_id).val(); // jQuery // 设置HTML内容 editor.html(HTML内容);
相关文章推荐
- KindEditor编辑器在ASP.NET中的使用
- asp.net MVC使用kindeditor编辑器
- 在线编辑器 KindEditor 在ASP.NET MVC 中使用
- 在asp.net中KindEditor编辑器的使用总结
- 在asp.net中KindEditor编辑器的使用总结
- asp.net MVC使用kindeditor编辑器
- 【HTML】KindEditor编辑器在ASP.NET中使用
- ASP.NET一款免费富文本(RichText)编辑器KindEditor,实现在线排版编辑文章。这里简单介绍下如何使用
- ASP.net mvc开发中使用纯html如何创建FCKeditor编辑器的使用
- ASP.NET使用百度编辑器(UEditor)使用方法
- 如何在Asp.net中使用HtmlArea编辑器
- 在ASP.NET Core中使用百度在线编辑器UEditor
- 在线html编辑器:Asp.net 在CKEditor中使用CKFinder(CKEditor3.1.2集合CKFinder2.1.1),完美组合
- ASP.NET动态网站开发培训-26.在线编辑器FreeTextBox的使用
- 百度Ueditor编辑器的使用,ASP.NET也可上传图片
- asp.net 文本编辑器kindeditor的使用
- Asp.net MVC使用KindEditor4
- ASP.NET MVC 2配置使用CKEditor编辑器