论坛首页 编程语言技术论坛

编辑器HTML标准化

浏览 2362 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-05-04  
五一期间,初步完成了wrap功能,就是选中的文字上添加自定义标记,比如span。
因为IE等浏览器执行默认的execCommand设置颜色、大小、字体时都会生成不标准的font tag,还有undo/redo时要保存选中状态,所以控制selection的range非常重要。

之前担心实现这个功能以后代码变得臃肿,没有深入研究这方面的技术。这几天仔细研究各个浏览器的selection和range以后发现其实没那么复杂,IE只不过没提供startContainer、startOffset之类的API,大部分代码可以和非IE浏览器(Firefox、Safari、Opera等)共用,这部分代码不超过300行。

例子:
这是红色文字。


选中"红色文字",设置成红色,并把文字大小设置成24px,不管在哪个浏览器都会生成span tag。
这是<span style="color:#ff0000;font-size:24px;">红色文字。</span>


上面例子是最简单的情况,还有选择多行、反复设置属性等复杂的情况,初步测试没发现大问题,只是发现IE的remove format命令不会清除span,这个功能要自己实现了。

感兴趣的同学可以看SVN里的代码
http://kindeditor.googlecode.com/svn/branches/roddy

接下来工作:
1. 仔细测试各个浏览器,修改bug。
2. undo/redo保存selection状态。

稳定之后包含在3.2版本里发布。


   发表时间:2009-08-10  
加油,看好你做的编辑器!!
0 请登录后投票
论坛首页 编程语言技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics