5 款免费实用的富文本编辑器

标签: 免费 富文本 编辑 | 发表时间:2013-11-25 10:27 | 作者:
出处:http://www.iteye.com
Web 应用经常会用到富文本编辑器功能,当然如果是 JavaScript 大牛,重复造轮子也是可以的,如果想省时省力,可以关注下下面 5 款免费的文本编辑器框架。

1.  widgEditor

widgEditor 体积小,只有 33.4 KB,简洁实用,支持 HTML 编码。

主要优点:朴素,代码小,易用;
缺点:功能不足,不易扩展,缺乏第三方支持。



使用方式:将源文件下载到本地磁盘,在适当的地方用下面代码进行引用

<link rel="stylesheet" href="widgEditor/css/widgEditor.css" />
<script src="widgEditor/scripts/widgEditor.js"></script>

2.  TinyMCE

优点:独立,易用;
缺点:代码量大



使用方式

<textarea id="TypeHere">Type some text here.</textarea>
<textarea id="NoTinyMCE">This is a text area.</textarea>

<script src="http://tinymce.cachefly.net/4.0/tinymce.min.js"></script>
<script type="application/x-javascript">
tinymce.init({selector:'#TypeHere'});
</script>

3.  MarkItUp

MarkItUp 基于 jQuery ,是一款 jQuery 插件,非常灵活,轻量,下载页有许多扩展,插件,皮肤,解析器和其它功能,MarkItUp 学习曲线比较陡峭,特别是把一些功能组合使用的时候。



使用方式

<textarea id="markItUp" cols="80" rows="20">
Some Sample Text
</textarea>

<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script src="MarkItUp/markitup/jquery.markitup.js"></script>
<script src="MarkItUp/markitup/sets/default/set.js"></script>

<link rel="stylesheet" href="MarkItUp/markitup/skins/simple/style.css" />
<link rel="stylesheet" href="MarkItUp/markitup/sets/default/style.css" />

<script>
$(document).ready(function() {
$('#markItUp').markItUp(mySettings);
});
</script>

4.  NicEdit

NicEdit 简便快捷,包含很全的格式化功能,支持各种元素类型。



使用方式

<textarea id="NicEdit" cols="80" rows="5">Some Sample Text</textarea>
<textarea id="NotNicEdit" cols="80" rows="5">Some Sample Text</textarea>
<div id="NicEdit2">Some Sample Text</div>

<script src="http://js.nicedit.com/nicEdit-latest.js"></script>

<script>
bkLib.onDomLoaded(function()
{
new nicEditor().panelInstance('NicEdit');
new nicEditor().panelInstance('NicEdit2');
});
</script>

5.  YUI 2

YUI2是一个极简的富文本编辑器。




使用方式
<textarea id="RichTextEdit" cols="100" rows="5">Some Sample Text</textarea>

<body class="yui-skin-sam">

<link rel="stylesheet" href="http://yui.yahooapis.com/2.9.0/build/fonts/fonts-min.css" />
<link rel="stylesheet" href="http://yui.yahooapis.com/2.9.0/build/editor/assets/skins/sam/simpleeditor.css" />

<script src="http://yui.yahooapis.com/2.9.0/build/yahoo-dom-event/yahoo-dom-event.js">
</script>
<script src="http://yui.yahooapis.com/2.9.0/build/element/element-min.js"></script>
<script src="http://yui.yahooapis.com/2.9.0/build/container/container_core-min.js">
</script>
<script src="http://yui.yahooapis.com/2.9.0/build/editor/simpleeditor-min.js"></script>

<script>
(function()
{
new YAHOO.widget.SimpleEditor('RichTextEdit').render();
})();
</script>


感谢 tuhaihe 投递这篇资讯

资讯来源: ODeveloper

已有 1 人发表留言,猛击->> 这里<<-参与讨论


ITeye推荐



相关 [免费 富文本 编辑] 推荐:

5 款免费实用的富文本编辑器

- - ITeye资讯频道
Web 应用经常会用到富文本编辑器功能,当然如果是 JavaScript 大牛,重复造轮子也是可以的,如果想省时省力,可以关注下下面 5 款免费的文本编辑器框架. widgEditor 体积小,只有 33.4 KB,简洁实用,支持 HTML 编码. 主要优点:朴素,代码小,易用;. 缺点:功能不足,不易扩展,缺乏第三方支持.

富文本编辑器杂谈

- - 标点符
在开发内容型网站的时候,少不了要接触富文本编辑器. 对开发人员来说,全新开发一个富文本编辑器会耗费大量的时间在细节的调整和坑的处理上. 在针对内部用户使用的系统中,普遍采用的方式是接入现成的开源编辑器,做简单的功能配置. 而针对面向普通用户的系统,富文本编辑器往往是单独进行设计和开发的. 在把一些功能较多,且可以配置功能项的编辑器称为传统编辑器,这类编辑器是最早出现的我们身边的,典型的代表有:百度的 ueditor、 ckeditor 4和 tinymce.

Essay:脱颖而出的富文本编辑器

- Jarod - 爱范儿 · Beats of Bits
iPhone 上的文字处理软件非常多,为什么要推荐这款 Essay. 因为它的简洁高效,因为它的云端同步,因为它顺手的控制功能,Essay 完全有实力成为沙砾中的宝石. 在 iPhone 上处理纯文本,用自带的备忘录就足够了,在什么情况下需要处理富文本呢. 例如想用 iPhone 完成一篇博客. 你当然可以用 WordPress for iPhone ,但它粗糙的功能和简陋的编辑器会让你失去愉快的感觉.

百度开源富文本编辑器UEditor v1.1.6 新版发布

- 小熊TONY - cnBeta.COM
UEditor是由百度 Web前端研发部开发的所见即所得的富文本在线编辑器,具有轻量,可定制,注重用户体验等特点,开源基于BSD协议,允许互联网开发者自由传播和使用代码. 百度UEditor的推出,可以帮助不少网站开者在开发富文本编辑器所遇到的难题,节约开发者因开发富文本编辑器所需要的大量时间,有效降低了企业的开发成本.

Flask项目集成富文本编辑器XHEditor

- - SegmentFault 最新的文章
本文介绍如何在Flask项目中集成富文本编辑器xhEditor,并实现图片上传、文件上传、视频上传、远程抓图等(包括拖拽上传)功能. xhEditor是一个基于jQuery开发的简单迷你并且高效的可视化HTML编辑器,基于网络访问并且兼容IE 6.0+, Firefox 3.0+, Opera 9.6+, Chrome 1.0+, Safari 3.22+.

百度推富文本开源编辑器 向第三方开放源代码

- Will - ITeye资讯频道
    百度正式发布Ueditor富文本Web编辑器,并向第三方开发者和团队开放编辑器源代码.     据了解,这款所见即所得的编辑器由百度web前端研发部开发,具有轻量,可定制,注重用户体验等特点. 业内人士认为,Ueditor开源编辑器能降低网站的开发成本,尤其在代码部署和定制化开发方面提供解决方案.

10个免费的PHP编辑器/开发工具

- Ian - ITeye资讯频道
一个好的编辑器或开发工具,能够极大提高我们的开发效率. 下面介绍10个免费、强大的PHP编辑器/开发工具. 这些编辑器拥有调试器、增量执行PHP脚本、查看每一行的所有变量值等功能.   Notepad++是一款非常有特色的编辑器,是开源软件,可以免费使用. 支持的语言: C, C++, Java , C#, XML, HTML, PHP, Javascript.

免费AVI/MKV编辑器:SolveigMM AVI Trimmer中文绿色便携版

- xcv58 - 精品绿色便携软件
SolveigMM AVI Trimmer是SolveigMM Video Splitter的精简版,是一款免费的AVI、MKV编辑器,可以方便地分割、修剪或剪切AVI、MKV视频,直接分割而无重新编解码过程,速度很快. SolveigMM AVI Trimmer + MKV支持DV、XviD、DivX、3ivX、MPEG-4等视频编码,音频支持MPEG-1,2 Layer I, II, III、AC3等.

Komodo Edit – 免费跨平台文本编辑 | 小众软件 > 办公软件

- Coolxll - 小众软件
公广二狗每天切换于 Mac/Win/Linux 之间,刚习惯一种环境就换另一种,神经分裂的厉害. 在文本编辑方面,二狗用 Komodo Edit,不轻量不强大,但中规中矩该有的都有了,关键是免费且跨平台使用体验一致,减少精神病患风险. 下载: 官网 | 下载 | 来自小众软件. ©2011 Thruth for 小众软件 | 原文链接 | 17 留言 | 加入我们 | 投稿 | 订阅指南.

微软宣布iPad版Office编辑功能免费,Android即将推出

- - 博客园_新闻
微软今天宣布了 Office 移动平台应用的重要更新. Office for Android 平板版应用即将推出预览版( 申请预览版),正式版要到明年年初. 微软也会很快宣布关于专为触控优化的 Windows 10 版 Office(Modern 版 Office)的消息. 对于已经推出的 Office for iOS,今天的宣布有两点重要内容:.