编辑器HTML标准化

五一期间,初步完成了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版本里发布。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值