【HTML】KindEditor编辑器在ASP.NET中使用

本文大多内容来自KindEditor官网,自己加工理解后做的一个备份。

编辑器使用方法

1. 下载编辑器

下载 KindEditor 最新版本,下载之后打开 examples/index.html 就可以看到演示。

下载页面: http://www.kindsoft.net/down.php

2.部署编辑器

解压 kindeditor-x.x.x.zip 文件,将所有文件上传到您的网站程序目录里

Note

您可以根据需求删除以下目录后上传到服务器。

  • asp - ASP程序
  • asp.net - ASP.NET程序
  • php - PHP程序
  • jsp - JSP程序
  • examples - 演示文件

3. 修改HTML页面

  1. 在需要显示编辑器的位置添加textarea输入框。
<textarea id="editor_id" name="content" style="width:700px;height:300px;">
&lt;strong&gt;HTML内容&lt;/strong&gt;
</textarea>
Note
id在当前页面必须是唯一的值。
在textarea里设置HTML内容即可实现编辑,在这里需要注意的是,如果从服务器端程序(ASP、PHP、ASP.NET等)直接显示内容,则必须转换HTML特殊字符(>,<,&,”)。具体请参考各语言目录下面的demo.xxx程序,目前支持ASP、ASP.NET、PHP、JSP。
在有些浏览器上不设宽度和高度可能显示有问题,所以最好设一下宽度和高度。宽度和高度可用inline样式设置,也可用 编辑器初始化参数 设置。
  1. 在该HTML页面添加以下脚本。
<script charset="utf-8" src="/editor/kindeditor.js"></script>
<script charset="utf-8" src="/editor/lang/zh_CN.js"></script>
<script>
        KindEditor.ready(function(K) {
                window.editor = K.create(‘#editor_id‘);
        });
</script>

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内容‘);

5.设置范例以及使用

地址 : http://kindeditor.net/ke4/examples/default.html

6.使用示例 下载

下载地址:     点  我  下  载

时间: 2024-08-13 08:17:47

【HTML】KindEditor编辑器在ASP.NET中使用的相关文章

KindEditor编辑器在ASP.NET中的使用

最近做的项目中都有用到富文本编辑器,一直在寻找最后用的富文本编辑器,之前用过CKEditor,也用过UEditor,这次打算用 一下KindEditor. KindEditor简介: KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所见即所得编辑效果,兼容IE.Firefox.Chrome.Safari.Opera等主流浏览器.KindEditor使用JavaScript编写,可以无缝的于Java..NET.PHP.ASP等程序接合. KindEditor非常适合

asp.net中使kindeditor自动生成缩略图

kindedtor编辑器,确实很好用,但是也有很多的不足,比如,我们经常用的图片上传功能,首页如果有图片新闻或者需要显示宿略图的时候,你会发现它并没有提供图片上传自动生成缩略图的功能 ,于是,花了一点时间,对它的上传图片的功能进行了改写,废话少说,直接上代码 图片上传功能调用的是:upload_json.ashx  代码如下 复制代码 using System; using System.Collections; using System.Web; using System.IO; using

详细介绍如何使用kindEditor编辑器

今天群里的朋友问我能不能写个kindEditor编辑器的使用教程,说是弄了半天没有搞定.由于PHP啦后台正好用了这个编辑器,我有写经验,正好教他的同时写出来分享给大家. kindEditor编辑器是一个由JS写成的在线编辑器,很多网站或CMS等都有用它,口碑不错,目前最新版本是4.1.10. 其实它的用法非常简单,我是在下载了它的安装包后看了一些demo然后就把它放到PHP啦的后台上去了.好了教程正式开始 一.下载 下载最新版本的kindEditor(官方网站kindeditor.net),下载

DWZ与KindEditor编辑器的整合

原文:DWZ与KindEditor编辑器的整合 DWZ自带的编辑器是xheditor,可能很多人用不习惯.就像我,习惯用kindeditor了.现在就来说说如何整合dwz和kindeditor. 一.打开DWZ的中的dwz.ui.js,进行修改. 首先找到 if ($.fn.xheditor) { $("textarea.editor", $p).each(function(){ var $this = $(this); var op = {html5Upload:false, ski

asp.net中web.config配置节点大全详解【转】

web.config 文件查找规则: (1)如果在当前页面所在目录下存在web.config文件,查看是否存在所要查找的结点名称,如果存在返回结果并停止查找. (2)如果当前页面所在目录下不存在web.config文件或者web.config文件中不存在该结点名,则查找它的上级目录,直到网站的根目录. (3)如果网站根目录下不存在web.config文件或者web.config文件中不存在该节点名则在%windir%"Microsoft.NET"Framework"v2.0.

KindEditor编辑器的使用

1.下载KindEditor编辑器  以KindEditor 4.1.10为例. 2.将下载解压完的KindEditor文件夹放在__ROOT__中. 3.在thinkphp中的Index/index.html中添加以下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quo

如何在Asp.net中备份Access数据库?

public   void   Create(   string   mdbPath   ) { if(   File.Exists(mdbPath)   )   //检查数据库是否已存在 { throw   new   Exception( "目标数据库已存在,无法创建 "); } //   可以加上密码,这样创建后的数据库必须输入密码后才能打开 mdbPath   =   "Provider=Microsoft.Jet.OLEDB.4.0;Data   Source= &

asp.ne中使用ajax和controller进行通信问题记录

为了页面显示和后端处理分离,使用了html+ajax+mvc的形式进行处理. 在这其中遇到的问题记录: 1. 在使用ajax向controller请求数据的时候,"get"方法会缓存上一次的请求,导致controller方法不能被debug跟踪到,开始以为是vs出错了,到后来才搞清楚. 解决方法:请求controller路径时加上随机数,或者使用"post"方法. 2. 在使用"POST"方法时,IE11要小心处理,因为ie会出现怎么都执行不了的

ASP.NET中的几种分页

1.通过DataGrid控件实现分页 ASP.NET中的DataGrid控件自带了分页功能,当绑定了DataGrid的数据源之后,须要对DataGrid控件进行一些设置: 左击控件右上角的小箭头→属性生成器: 选择左边的[分页]选项卡 选中[同意分页].[页大小]表示一页显示多少条数据:导航button的[位置]有顶.底.上下型三种选择.[模式]有页码和"上一页.下一页button".假设选择了页码模式.[数值button]表示最多显示的button数量,假设选择了还有一种模式,&qu