一般的做网站后台都会用到富文本编辑器,网上也有很多优秀的富文本编辑器,这里是开源中国的富文本编辑器推荐:http://www.oschina.net/project/tag/172/wysiwyg

我用过CKeditor比较庞大,这里我用了一个国产开源的富文本编辑器(JS开发)KindEitor官网地址:http://www.kindsoft.net/

开始前我要说下,开发时最好用最新的KindEitor因为网上有文章说KindEitor3.x-4.1有漏洞例如:

http://www.2cto.com/Article/201207/140017.html

http://www.cnseay.com/504/

官方最目前新版的是:4.1.7 请大家去下载:http://www.kindsoft.net/down.php

好了说了这么进入正题:

下载下来是这样的红线标的是要的文件:

把这些文件复制进入你的项目:

对应的前台代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="KindEidtor._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>KindEditor测试Demo</title>
<%--必须引入的对应CSS和JS--%>
<link 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="js/jquery-1.8.2.js"></script>
<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" charset="utf-8">
$(function () {
var editor = KindEditor.create('textarea[name="txtEditor"]', {
//上传文件管理
uploadJson: 'handler/upload_json.ashx',
//文件管理
fileManagerJson: 'handler/file_manager_json.ashx',
//编辑器宽度
width: '700px',
//编辑器的显示功能
items:[
'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'cut', 'copy', 'paste',
'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
'flash','insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
'anchor', 'link', 'unlink', '|', 'about'
] });
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="margin: 20px auto; width: 800px;">
<asp:TextBox id="txtEditor" runat="server" style="width:750px;height:450px;" TextMode="MultiLine"></asp:TextBox>
</div>
</form>
</body>
</html>

这个例子只有简单的功能,更的配置请看官方的文档:http://www.kindsoft.net/doc.php

KindEditor简单的Demo使用的更多相关文章

  1. C#可扩展编程之MEF学习笔记(一):MEF简介及简单的Demo

    在文章开始之前,首先简单介绍一下什么是MEF,MEF,全称Managed Extensibility Framework(托管可扩展框架).单从名字我们不难发现:MEF是专门致力于解决扩展性问题的框架 ...

  2. Maven+Spring+Hibernate+Shiro+Mysql简单的demo框架(二)

    然后是项目下的文件:完整的项目请看  上一篇 Maven+Spring+Hibernate+Shiro+Mysql简单的demo框架(一) 项目下的springmvc-servlet.xml配置文件: ...

  3. MEF简介及简单的Demo

    MEF简介及简单的Demo 文章开始之前,首先简单介绍一下什么是MEF,MEF,全称Managed Extensibility Framework(托管可扩展框架).单从名字我们不难发现:MEF是专门 ...

  4. Spring源码学习:第1步--在Spring源码中添加最简单的Demo代码

    为了最大程度地贴近Spring源码并进行学习,一种比较直接的做法是:直接在Spring源码中加入Demo代码,并进行调试. 参照以前使用Spring的经验,Spring最简单的使用方法是:一个实体类. ...

  5. Dubbo入门—搭建一个最简单的Demo框架

    一.Dubbo背景和简介 1.电商系统的演进 Dubbo开始于电商系统,因此在这里先从电商系统的演变讲起. a.单一应用框架(ORM) 当网站流量很小时,只需一个应用,将所有功能如下单支付等都部署在一 ...

  6. Dubbo入门---搭建一个最简单的Demo框架(转)

    Dubbo背景和简介 Dubbo开始于电商系统,因此在这里先从电商系统的演变讲起. 单一应用框架(ORM) 当网站流量很小时,只需一个应用,将所有功能如下单支付等都部署在一起,以减少部署节点和成本.  ...

  7. Dubbo简介---搭建一个最简单的Demo框架

    Dubbo背景和简介 Dubbo开始于电商系统,因此在这里先从电商系统的演变讲起. 单一应用框架(ORM) 当网站流量很小时,只需一个应用,将所有功能如下单支付等都部署在一起,以减少部署节点和成本.  ...

  8. [MyBean说明书]-如何进行最简单的DEMO

    MyBean是轻量级的.绿色的框架,不需要安装任何的组件和携带任何的其他文件,前 期步骤已经相当精简了,仔细阅读完下面简单的五个步骤,就可以编写基于MyBean的插件: 1.加入Delphi的搜索路径 ...

  9. Python实例---简单购物车Demo

    简单购物车Demo # version: python3.2.5 # author: 'FTL1012' # time: 2017/12/7 09:16 product_list = ( ['Java ...

随机推荐

  1. Memcached应用总结

    Memcached应用总结 memcached是一款高性能的分布式缓存系统,凭借其简单方便的操作,稳定可靠的性能广泛应用于互联网应用中,网上关于memcached介绍的资料也很多,最经典的资料就是&l ...

  2. 解决easyui datagrid加载数据时,checkbox列没有根据checkbox的值来确定是否选中

    背景:   昨天帮朋友做一个easyui datagrid的小实例时,才发现easyui datagrid的checkbox列,没有根据值为true或false来选中checkbox,当时感觉太让人失 ...

  3. 逆天的IE7中,绝对定位元素之间的遮盖问题

    个人比较支持IE9以上的版本,认为他们的样式和效果都是比较人性化的,不过很多时候还是不得不考虑其他版本浏览器的感受,这里IE6就不用考虑他了,这货简直就是IT史上的奇葩,这里要说一个IE7的绝对定位和 ...

  4. 常用的JavaScript正则匹配规则代码收藏,很实用

    收集一些常用的JavaScript正则表达式匹配规则,比如匹配电话号码.Email.中文字符.身份证号.邮编.QQ号.过滤空白行.匹配特定数字等.觉得这玩意是很有用的,只不过自己水平菜,老是自己写不出 ...

  5. 【学习笔记】【oc】copy与mutableCopy

    copy 返回一个不可变的对象: mutableCopy 返回一个可变的对象: 使用copy方法时 类必须实现:<NSCopying>协议中的-(id)copyWithZone:(NSZo ...

  6. 移动端app测试

    对于手机项目(应用软件),主要是进行系统测试. 而针对手机应用软件的系统测试,我们通常从如下几个角度开展测试工作: 功能模块测试: 交叉事件测试: 性能测试: 安全测试: 容量测试: 兼容性测试: 接 ...

  7. 转:CRect类 的介绍

    类CRect是对Windows结构RECT的封装,凡是能用RECT结构的地方都可以用CRect代替. 结构RECT表示一个矩形的位置和尺寸,其定义为: typedef struct tagRECT{ ...

  8. android编程之悬浮窗体

    用过手机360和QQ手机管家等一些软件的朋友,会发现,在这些应用中,会出现一个悬浮窗体,例如QQ手机管家中打电话的场景: 这种窗体除了会显示外,还可以移动它的位置,并且一直显示.除了关闭当前程序外,窗 ...

  9. Android中支持的常用距离单位

    px(像素):每个px对应屏幕上的一个点.dip或dp(device independent pixels,设备独立像素):一种基于屏幕密度的抽象单位.在每英寸160点的显示器上,1dip=1px.但 ...

  10. 什么是PWM、PFM及VFM

    做电源设计的大都知道PWM和PFM这两个概念.而VFM模式是在大功率輸出時為PWM模式在輕負載輸出時變為PFM模式的一種混合開關模式.目前开关电源的控制技术主要就是这三种:1.脉冲宽度调制器(PWM) ...