原来也写过一篇关于百度Ueditor编辑器的介绍：百度Ueditor编辑器的使用,ASP.NET也可上传图片

最开始是使用CuteEditor控件，需要好几mb的空间，因为刚开始学习ASP.NET的时候，觉得简单就是拉控件上去，后来自己发现了百度Ueditor编辑器，再后来看见热心人的评论也知道了KindEditor编辑器，后来也改用了这个 KindEditor编辑器 ，因为它比百度编辑器占的空间小，感觉也好一点，后来做网站，有时站内留言或者发贴子，我觉得这类编辑器功能太多了点，总感觉只适合新闻类编辑器，后来就网上不停的百度和Google查找，找了很久看见了淘宝开源的Kissy Editor编辑器，感觉很好，后来不小心在博客园又发现了一个简易的编辑器，感觉更容易看懂，也方便修改，只是界面没有淘宝的好看，但是对于简易的留言板还是够用了，两编辑器界面如下所示：

 Kissy Editor编辑器

简易编辑器，是查看了博客园http://www.cnblogs.com/lexus/archive/2010/09/12/1824214.html这篇博客

kissy editor目录结构如下图所示：

kissy editor可以根据个人需求，ToolBar可以控制显示哪些，可输入字符个数，等等都可以在editor-aio.js脚本文件中修改，由于此脚本只显示一行，找到相应修改的位置有点困难，你可以先查看editor.js脚本文件，找到需要修改的地方，然后在editor-aio.js中查找，如下修改字符个数的操作，如图所示：

kissy editor 的工具条也可以找到相应的editor-aio.js 文件进行修改，如下图所示：

淘宝上下载，会有一个demo的例子，由于我不想在此目录下面，因为我写的一个小例子，不在此目录下方，我就修改了路径，原有的那个demo.html中图像选择会显示不出图片，如下图所示：

需要按照自己的项目需求而修改，这里只是举了一个简单的例子。

kissy editor 的使用代码如下所示：


 2 <html xmlns="http://www.w3.org/1999/xhtml">

 3 <head>

 4     <title></title>

 5     <link href="kissy_editor/themes/default/editor-min.css" rel="stylesheet" type="text/css" />

 6     <style type="text/css">

 7     #Submit1{ padding:5px 5px 5px 5px;}

 8     </style>

 9 </head>

10 <body>

11 <form action="data.aspx" method="post">

12 <textarea id="demo" name="code" cols="142" rows="15">

13    <p>欢迎使用 KISSY Editor!</p>

14 </textarea>

15 <p><input id="Submit1" type="submit" value="提交" /></p>

16 </form>

17 <script src="kissy_editor/editor-aio.js" type="text/javascript"></script>

18 <script type="text/javascript">KISSY.Editor("demo");</script>

19 </body>

20 </html>

下面说一下简易HTMl编辑器，使用方式如下代码所示：

 2 
 3 <html xmlns="http://www.w3.org/1999/xhtml">
 4 <head>
 5     <title></title>
 6     <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
 7     <script src="ebox/ebox.js" type="text/javascript"></script>
 8 </head>
 9 <body>
10 <form action="data.aspx" method="post">
11   <textarea name="code" id="ebox">欢迎使用简易编辑器</textarea>
12   <p><input type="submit" value="submit" /></p>
13 </form>
14 <div style=" margin:0 auto; text-align:center;"></div>
15 <script type="text/javascript">
16     $("#ebox").css("height", "350px").css("width", "100%").htmlbox({
17         toolbars: [
18         [
19         "undo", "redo", "removeformat", "bold",
20         "underline", "strike", "italic", "sup", "sub",
21         "left", "center", "right", "indent", "outdent",
22         "link", "unlink", "image", "quote", "striptags", "code",
23         "fontcolor", "highlight", "fontsize", "fontfamily", "styles"
24         ]
25     ]
26     });
27 </script>
28 </body>
29 </html>

相信你看见了代码，就知道可以更改ToolBar显示哪些已有的功能，很简单吧。

写了有些凌乱，不要见怪，在此分享，那些需要简易编辑器的，下载使用，还是不错的选择。

下载地址：点击这里下载

版权所有，转载请注明出处！

一切伟大的行动和思想，都有一个微不足道的开始。微不足道的我，正在吸取知识的土壤，希望能取得成功！不嫌弃我微不足道的，愿交天下好友！

本文完全引用自: 作者xu_happy_you 的 http://www.cnblogs.com/cmsdn/archive/2012/04/17/2451893.html

淘宝开源编辑器Kissy Editor和简易留言编辑器【转】的更多相关文章

  1. 淘宝开源Key/Value结构数据存储系统Tair技术剖析

    摘要: Tair的功能 Tair是一个Key/Value结构数据的解决方案,它默认支持基于内存和文件的两种存储方式,分别和我们通常所说的缓存和持久化存储对应. Tair除了普通Key/Value系统提 ...

  2. 基于淘宝开源Tair分布式KV存储引擎的整合部署

    一.前言 Tair支撑了淘宝几乎所有系统的缓存信息(Tair = Taobao Pair,Pair即Key-Value键值对),内置了三个存储引擎:mdb(默认,类似于Memcache).rdb(类似 ...

  3. 淘宝开源Web服务器Tengine安装教程

    简介Tengine是由淘宝核心系统部基于Nginx开发的Web服务器,它在Nginx的基础上,针对大访问量网站的需求,添加了很多功能和特性.Tengine的性能和稳定性已经在大型的网站如淘宝网,淘宝商 ...

  4. 淘宝开源Web服务器Tengine基本安装步骤

    Tengine 是由淘宝核心系统部基于Nginx开发的Web服务器,它在Nginx的基础上,针对大访问量 网站的需求,添加了很多功能和特性.Tengine的性能和稳定性已经在大型的网站如淘宝网,淘宝商 ...

  5. 超级强大的淘宝开源平台(taobao-code)

    今天发现了一个免费又高级的开源SVN服务器,taobao,阿里云CODE.迫不及待的注册了一个.感觉不错,分享给大家. 先说说我们用过的几个SVN服务器吧: google code oksvn(感觉不 ...

  6. 淘宝开源系统监控工具Tsar

    Tsar是淘宝开发的一个非常好用的系统监控工具,在淘宝内部大量使用    它不仅可以监控CPU.IO.内存.TCP等系统状态,也可以监控Apache,Nginx/Tengine,Squid等服务器状态 ...

  7. 淘宝开源项目之Tsar

    软件介绍: Tsar是淘宝开发的一个非常好用的系统监控工具,在淘宝内部大量使用,它不仅可以监控CPU.IO.内存.TCP等系统状态,也可以监控Apache,Nginx/Tengine,Squid等服务 ...

  8. 淘宝开源平台(taobao-code)使用

    偶尔之下翻到的这个东西,瞬间觉得足以解决自己在开发过程中的版本控制问题.就注册了一个试试.先是在度娘上搜寻“淘code”,进入官网之后直接注册.然后构建自己的项目,上传代码就OK了. 一.搜寻“淘co ...

  9. 淘宝开源任务调度框架tbschedule

    背景 分布式任务调度是非常常见的一种应用场景,一般对可用性和性能要求不高的任务,采用单点即可,例如linux的crontab,spring的quarz,但是如果要求部署多个节点,达到高可用的效果,上面 ...

随机推荐

  1. AAPT2 error: check logs for details 问题的终究修复

    AAPT2 error: check logs for details Process 'command '***\build-tools\27.0.3\aapt.exe'' finished wit ...

  2. Golang 入门~~基础知识

    变量声明 //通用形式,指定变量名,变量类型,变量值 var name int = 99 fmt.Println(name) //指定变量名,以及变量类型,未指定值的时候默认是类型零值 var age ...

  3. [转帖]Nginx安装及配置详解 From https://www.cnblogs.com/zhouxinfei/p/7862285.html

    Nginx安装及配置详解   nginx概述 nginx是一款自由的.开源的.高性能的HTTP服务器和反向代理服务器:同时也是一个IMAP.POP3.SMTP代理服务器:nginx可以作为一个HTTP ...

  4. CENTOS7修改ip

    编辑网卡设置 vi /etc/sysconfig/network-scripts/ifcfg-ens33 编辑内容 vi /etc/sysconfig/network-scripts/ificg-en ...

  5. 解决从pip上下载的最新flask版本不能运行flaskr和最新特性的问题

    由于在测试flask的单元测试.所以准备弄个环境,查询官方文档发现flask源码里面有一个example文件夹里面有个flaskr应用 可供测试 看了一下readme文档,大致是这样 / Flaskr ...

  6. lambda函数对象与作用域 （重点）

    Python函数在定义的时候,默认参数L的值就被计算出来了,即[],因为默认参数L也是一个变量,它指向对象[],每次调用该函数,如果改变了L的内容,则下次调用时,默认参数的内容就变了,不再是函数定义时 ...

  7. appium学习记录2

    unittest 学习 每执行一次 testcase 就会调用一次 setUP 与teardown 类方法只会执行一次 开始 与结束时候执行 类似反射方法 __init__ 与 __del__ set ...

  8. docker--Dockerfile--sonarqube

    FROM openjdk:8 ENV SONAR_VERSION=6.7.1 \ SONARQUBE_HOME=/opt/sonarqube \ # Database configuration # ...

  9. BZOJ2795&2890&3647[Poi2012]A Horrible Poem——hash

    题目描述 给出一个由小写英文字母组成的字符串S,再给出q个询问,要求回答S某个子串的最短循环节.如果字符串B是字符串A的循环节,那么A可以由B重复若干次得到. 输入 第一行一个正整数n (n<= ...

  10. BZOJ2069 POI2004ZAW（最短路）

    显然这样的路径一定是选择了与1相邻的不同的两点分别作为起点和终点(除1本身).如果能将每一组起点终点都计算到就可以得出最优解了.暴力显然不行.注意到我们每次求出的是单源最短路径,考虑如何充分利用信息. ...