这几天一直在寻找好用的在线富文本编辑器,本人的要求并不要,不需要有太多的功能,找来找去觉得Kissy Editor 更适合自己,功能满足要求,而且界面简洁令人看着舒坦。但是有一些问题:
1. 最大字符数不能根据需要设置,只能在js里改,这样如果多处要用这个编辑器且要求的字数不一样,这就不好办了。
2. 编辑器有一个小bug,只有在IE里才有。输入一段文字后再清空输入域,你会发现输入域并没有完全空,使用source模式可以看到有一小段样式代码
3. 不能定制编辑器,比如有些地方只需要少许功能,有些地方只需要一个计数功能,有些地方需要所有功能。
4. 下拉菜单的样式不好看
笔者花了一些时间对以上几点做了改进。给KISSY.Editor增加一个属性KISSY.Editor.customized = {type:"normal", maxTextLength:100};然后修改了一下代码:
KISSY.Editor.add("config", function (a) {
if(a.customized.type === "countonly") {
a.config = {base:"res/kissy/", language:"zh-cn", theme:"default", toolbar:[], statusbar:["wordcount"], pluginsConfig:{}};
}
else if(a.customized.type === "simple") {
a.config = {base:"res/kissy/", language:"zh-cn", theme:"default", toolbar:["source", "", "fontName", "fontSize", "bold", "italic"], statusbar:["wordcount"], pluginsConfig:{}};
}
else if(a.customized.type === "normal") {
a.config = {base:"res/kissy/", language:"zh-cn", theme:"default", toolbar:["source", "", "fontName", "fontSize", "bold", "italic", "underline", "strikeThrough", "foreColor", "backColor", "", "link", "", "insertOrderedList", "insertUnorderedList", "justifyLeft", "justifyCenter", "justifyRight"], statusbar:["wordcount", "resize"], pluginsConfig:{}};
}
else {
a.config = {};
}
});
如何在页面上使用?
<textarea id="textarea1" style="width:450px;height:200px;">123456</textarea>
KSSY.Editor.customized = {type:"normal", textMaxLength:500};
var editor = new KISSY.Editor("textarea1", undefined);
editor.contentDoc.body.innerHTML="hello";
如果要在JS里设置给输入域赋值,可以这样:
editor.contentDoc.body.innerHTML="hello";
如果要获得输入域的值可以调用editor.getContentDocData()
分享到:
相关推荐
"Kissy Editor"是压缩包中的一个文件,这可能是一款特定的富文本编辑器。Kissy Editor 1.0.0 build242版本可能是该编辑器的一个发行版,它可能包含了一些基本的编辑功能和优化的性能。Kissy Editor基于JavaScript库...
KISSY Editor 是开源项目 KISSY UI Library 的一个组件。KISSY 目前基于 YUI 2.x 开发,目标是打造一系列小巧灵活、简洁实用、使用起来让...目前已有 CSS 基础框架、搜索提示 Suggest 和今天发布的富文本编辑器等组件。
2. 精简实用:编辑器的核心功能包括富文本编辑,如文本格式化、插入图片、链接、列表、表格等,满足了日常内容创作的基本需求。Kissy Web编辑器注重用户体验,界面设计简洁,使得用户能快速上手,减少学习成本。同时...
**JS开源编辑器 Kissy Editor** 是一个专为前端开发者设计的轻量级文本编辑器,它具有良好的浏览器兼容性,能适应各种主流浏览器环境,包括Chrome、Firefox、Safari、Opera以及Internet Explorer等。Kissy Editor的...
Kissy Editor 1.0.0 Build 242,作为一款优秀的在线文本编辑器,为用户提供了便捷、高效的富文本编辑体验。本文将深入探讨Kissy Editor的功能特性、使用场景以及核心优势,旨在帮助开发者更好地理解和运用这款工具。...
《Kissy Editor:淘宝官方富文本编辑器深度解析》 Kissy Editor,作为一个源自淘宝官方的富文本编辑器,它的出现极大地提升了网页内容编辑的便捷性和用户体验。在深入理解这个编辑器之前,我们先来看看其核心特点:...
淘宝的KISSY编辑器ver.1.0是一款基于Yahoo! User Interface Library (YUI3)构建的专业级富文本编辑器。...如果你正在寻找一个轻量级、高效的富文本编辑器,淘宝的KISSY编辑器ver.1.0无疑是一个值得考虑的选择。
淘宝发布开源编辑器:KISSY Editor,和我们在 WordPress 后台使用的富文本编辑器 TinyMCE 一样,它可以让我们在线编辑和格式化文本,但是相比 TinyMCE KISSY Editor 更加轻巧,更加适合国内的网络环境。 KISSY ...
淘宝开源编辑器KISSY Editor是一款基于JavaScript的富文本编辑器,由淘宝网开发并公开发布。KISSY Editor致力于提供一个高性能、易用且可高度定制的Web内容编辑解决方案。它以其模块化的设计理念,允许开发者根据...
它通常通过简单的API调用即可实现与后端数据的交互,适合快速构建简单的富文本编辑功能。虽然功能相对简单,但TinyEditor对于不需要复杂编辑功能的小型项目来说,是一个高效且实用的选择。 KISSY和TinyEditor在编辑...
**KISSY Editor** 是一个轻量级且高度可定制的网页编辑器,它专为开发者设计,提供了丰富的API和灵活的插件机制,使得在网页中实现富文本编辑功能变得更加简单。这款编辑器以其小巧的体积、高效的性能以及易用性著称...
Kissy Editor 2.0是淘宝帮派推出的一款强大的富文本编辑器,专为提升用户在社区中的内容创作体验而设计。它集成了多种功能,使用户可以方便地创建、编辑和格式化文本,同时还支持插入图片、视频等多种媒体元素,极大...
淘宝发布开源编辑器:KISSY Editor,和我们在 WordPress 后台使用的富文本编辑器 TinyMCE 一样,它可以让我们在线编辑和格式化文本,但是相比 TinyMCE KISSY Editor 更加轻巧,更加适合国内的网络环境。
最新淘宝宝贝描述编辑器 2.0beta版 KISSY Gallery 说明 展览馆,存放社区贡献的正式组件 组件目录结构 0) assets 统一使用 UTF-8; 1) github上 Gallery 目录结构说明: gallery 根目录下, 提交各个组件目录, 拿...
淘宝在线编辑器JAVA版是一款基于KISSY Editor的富文本编辑器,专为Java开发者设计,支持文件上传功能。KISSY Editor是阿里巴巴开源的一款强大的JavaScript富文本编辑器,而这个JAVA版则提供了与服务器端交互的能力,...
在 Web 编辑器领域, CKEditor – 七年的专注,赢取的是王者风范。 TinyMCE – 五年前的小家碧玉,如今已成长为大家闺秀。...于是有了今天发布的淘宝开源编辑器:KISSY Editor, 已在 淘帮派 上线试用。
- `src`目录:存放Kissy库的源代码,按照模块结构组织,开发者可以在这里查看和修改源码。 - `docs`目录:包含Kissy的文档,包括API参考、教程和示例,便于学习和参考。 - `tests`目录:测试用例,用于验证Kissy的...
2. **兼容性广泛**:Kissy 针对不同的浏览器进行了广泛的兼容性测试,包括老旧的IE浏览器,这使得开发者无需担心因浏览器差异带来的问题,可以专注于功能实现。 3. **组件丰富**:Kissy 提供了一系列的内置组件,如...
Kissy 是一个轻量级的前端JavaScript库,它旨在简化Web开发,提高代码效率和可维护性。这个“Kissy学习教程”压缩包文件包含了深入理解并掌握Kissy的资源,帮助开发者快速上手和应用Kissy到实际项目中。 在学习...