{ focus : web }

搜狗发布了很有意思的javascript输入法 : 搜狗云输入法 基本原理即是：将一段js代码当作书签，当选择时执行，执行时动态插入一个script文件，来监控页面所有框并根据输入拼音异步请求服务器获得中文文字。 目前来看，尚存在一点问题： 1。':' 冒号mac下输不出来，看来是组合键处理上存问题 2。没有处理选择一段文本输入后替换原文字，目前是仍然插入输入区域后面 ...

编辑器撤销(undo)与重做(redo)插件的设计与实现 ，涉及三个方面：   1. 编辑器状态定义   不仅要包含当前编辑器的内容（body.innerHTML），还要考虑编辑区域用户的选中状态，用户选中每个区域进行高亮等操作，则操作前要把当前选中区域以及内容html都要保存下来：       /** * 当前编辑区域状态，包括html与选择区域...

ckeditor 的列表格式化与清除不同于 块状格式化（h1,h2），行内格式化（span），没有采用直接和range打交道（extractContent），可能由于列表很注重标签间的关系（并列与嵌套），变化也比较死板，ck 采用了与通用的块状格式化与行内格式化稍微不同的方法。 1.格式化 格式化前：         由于我们选中的range经...

早期互联网上流行的防止copy方法，禁掉右键，其实查看源代码或者 ctrl-c 后，秘密就无处遮掩了，只防纯小白。这次实验新的方法来解决查看源代码与 ctrl-c 的问题（当然 firebug 类工具还是无法欺骗的），首先声明我支持开放，Just For Fun ！（感谢 lifesinger 的关键技术点探索）。   PS：根据众多网友反馈，该方法在使用浏览器工具栏编辑菜单复制时失效...

序言：       承接上文，ckeditor 既然不用 execCommand ，那么编辑器的格式化功能就只能通过自己手动添加格式化标签实现，一般格式化包括四步： 1.得到选择位置， 2.抽取选择节点集， 3.对节点集格式化， 4.格式化节点集加入文档，     其中第1步在标准浏览器中可以通过w3c range 直接得到，而ie 则要费些周折...

ckeditor是目前各个浏览器间比较统一的富文本编辑器，相对于 yui2 editor ,其更注重兼容性问题，花了很大力气实现了等价于  w3c range 的功能，并且完全不采用  document.execCommand 这一浏览器的原生功能（兼容性问题严重），仅仅依赖dom操作来分隔节点与插入格式化标签到对应位置。 源码概述： 通过引入...

承续，YUI2 RTE分析－1：核心函数 ，分析一下yui editor如何解决最头疼的execCommand兼容性问题，RTE的主要作用之一就是用户可以对自己输入的内容进行格式调整，而这一功能主要是通过浏览器提供的exeCommand来实现的，但是这个函数各个浏览器间的运行效果差异很大，详见：execCommand Compatibility    ，yui editor很多格式化功能实...

富文本编辑器(RTE)一直是浏览器兼容性的重灾区，不看YUI Editor源码之前还只停留在概念上，看完之后确实挺震撼，editor代码和yui关系已经不大了，很大一部分代码都在if－else判断浏览器，当然editor也有一个很好的架构来对付浏览器差异问题，这次说得是写一个 RTE 所需要的核心函数。 例子：   编辑区内容html代码： <h...

对以前文章：range标准化读取 的再次整理：         ppt @ slidershare    

周六很荣幸参加了 webrebuild 上海 的第四届年会，就正在做的kissy editor的目前体会做了一点分享：       ppt @ slideshare 其中提问到了一个很有趣的问题，为什么不建议 w3c 指定编辑器规范从而由浏览器实现？ 今天先简单说下那天我的回复： 是的，这样子是可以提高效率（目前 html5 也确...

从 7.19 开始调研并开发到现在，经过两周的测试算是基本稳定了，下一步就是重构以及插件规划，完善插件层次，抽象公共功能，先放出预览地址： kissy editor 2.0 beta 也有必要整理一下思路。   功能：       由左至右包括：源代码查看，预览，模板，撤销与重做，清除格式，大小，字体，加粗，倾斜，下划线，删除线，标题格式...

range 是用户选择区域的唯一表示方法，存在 w3c 的标准化 range ，以及 ie 特有的 textrange 与 controlrange ，相对于 ie ，w3c 的概念更易于理解，首先简要介绍一下 w3c range. w3c range range 用来表示用户的选择区域，这块选择区域由两个边界位置界定，而位置则由其容器以及偏移量构成，称作...

场景与问题： 查看 demo：ff-iframe-bug 初始状态下 iframe 中的内容可编辑，可选中，当动态改变 iframe 的 position（即改变 layout ）后，该 iframe 出现三个问题： 1. 不可编辑 2. 光标消失 3.原先选中区域（光标位置）丢失 分析与修复： ...