主页 > 知识库 > ASP.NET网站使用Kindeditor富文本编辑器配置步骤

ASP.NET网站使用Kindeditor富文本编辑器配置步骤

热门标签:电销业务 网站排名优化 电商新玩法 百度AI接口 科大讯飞语音识别系统 国美全国运营中心 客户服务 人工智能
1. 下载编辑器
下载 KindEditor 最新版本,下载页面: http://www.kindsoft.net/down.php

2. 部署编辑器
解压 kindeditor-x.x.x.zip 文件,将editor文件夹复制到web目录下
 
3、在网页中加入(ValidateRequest="false")
复制代码 代码如下:

%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false" CodeBehind="XXX.cs" Inherits="XXX" %>

4、引入脚本文件(XXX部分需要修改)
复制代码 代码如下:

!--富文本编辑器配置↓ -->
link type="text/css" rel="stylesheet" href="../editor/themes/default/default.css" />
link rel="stylesheet" href="../editor/plugins/code/prettify.css" />
script type="text/javascript" charset="utf-8" src="../editor/kindeditor-min.js">/script>
script type="text/javascript" charset="utf-8" src="../editor/lang/zh_CN.js">/script>
script type="text/javascript" charset="utf-8" src="../editor/plugins/code/prettify.js">/script>
script type="text/javascript">
KindEditor.ready(function (K) {
var editor1 = K.create('#XXX', {
items: [
'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
'removeformat', 'strikethrough', 'lineheight', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
'insertunorderedlist', '|', 'emoticons', 'link', 'insertfile', 'media', '|', 'image', 'multiimage', 'map', 'baidumap', '|', 'preview', 'fullscreen',
],
cssPath: '../editor/plugins/code/prettify.css',
uploadJson: '../editor/asp.net/upload_json.ashx',
fileManagerJson: '../editor/asp.net/file_manager_json.ashx',
allowFileManager: true,
pasteType: 1,
afterCreate: function () {
var self = this;
K.ctrl(document, 13, function () {
self.sync();
K('form[name=XXX]')[0].submit();
});
K.ctrl(self.edit.doc, 13, function () {
self.sync();
K('form[name=XXX]')[0].submit();
});
}
});
prettyPrint();
});
/script>
!--富文本编辑器配置↑-->

5、使用编辑器(XXX部分需要修改)
复制代码 代码如下:

!--富文本编辑器-->
textarea id="XXX" name="XXX" runat="server" cols="100" rows="8" style="width:1000px;height:500px;visibility:hidden;">/textarea>

6、根据自己的需要修改配置(文件路径:web\editor\asp.net\file_manager_json.ashx)
复制代码 代码如下:

//根目录路径,相对路径
String rootPath = "../../";
//根目录URL,可以指定绝对路径
String rootUrl = aspxUrl + "../attached/";
//图片扩展名
String fileTypes = "gif,jpg,jpeg,png,bmp";

7、后台获取编辑器内容(XXX部分需要修改)
复制代码 代码如下:

Request.Form["XXX"]

由于服务器端程序(ASP、PHP、ASP.NET等)直接显示内容,则必须转换HTML特殊字符(>,,,”),所以写了个工具类
复制代码 代码如下:

public class HtmlUtil
{
/// summary>
/// 替换HTML特殊字符
/// /summary>
/// param name="content">/param>
/// returns>/returns>
public static String escapeHtml(String content)
{
return content.Replace("", "")
.Replace("", "")
.Replace(">", ">")
.Replace("\"", """);
}
/// summary>
/// 还原HTML特殊字符
/// /summary>
/// param name="content">/param>
/// returns>/returns>
public static String unescapeHtml(String content)
{
return content.Replace("", "")
.Replace("", "")
.Replace(">", ">")
.Replace(""", "\"");
}
}

往数据库插入时,进行替换特殊字符(XXX部分需要修改)
复制代码 代码如下:

HtmlUtil.escapeHtml(Request.Form["XXX"])

从数据库读取数据时,进行还原特殊字符(XXX部分需要修改)
复制代码 代码如下:

HtmlUtil.unescapeHtml(XXX)
您可能感兴趣的文章:
  • Win10中VC2013安装Unit test组件出现问题解决方案
  • Unity3d获取系统时间
  • unity3d调用手机或电脑摄像头
  • Unity3D动态对象优化代码分享
  • Unity3D中脚本的执行顺序和编译顺序
  • asp.net ckeditor编辑器的使用方法
  • ASP.NET中FCKEDITOR在线编辑器的用法
  • VS2017做为Unity3D的脚本编辑器需要的最精简组件

标签:攀枝花 厦门 枣庄 南平 拉萨 咸宁 POS机 益阳

巨人网络通讯声明:本文标题《ASP.NET网站使用Kindeditor富文本编辑器配置步骤》,本文关键词  ;如发现本文内容存在版权问题,烦请提供相关信息告之我们,我们将及时沟通与处理。本站内容系统采集于网络,涉及言论、版权与本站无关。
  • 相关文章
  • 收缩
    • 微信客服
    • 微信二维码
    • 电话咨询

    • 400-1100-266