Javascript 所见即所得编辑器和字体大小，我很困惑

Question

我正在创建一个 Javascript 所见即所得编辑器(是的，我知道已经有一百万个了，但没有一个能满足我的需求)，但我遇到了困难。

我的编辑器只需要两个功能:

1) 用户应该能够选择 pts 中指定的任何字体大小。 2) 用户应该能够在同一编辑器窗口中显示各种大小的文本。

听起来很简单，但您会惊讶于这有多么困难。

我已经看过 TinyMCE、NicEdit、FreeRichTextEditor、TinyEditor、openWYSIWYG、WYMeditor、jHtmlArea、uEditor、CLEditor、jQRTE、jQuery Simple WYSIWYG Editor 和 xinha，但它们都没有这两种功能。

我能找到的唯一符合要求的编辑器是 Google Docs、CKEditor 和 YUI Rich Text。 Google Docs 不是一个选项，CKEditor 是 850 美元，对我的项目来说太过分了，YUI 富文本编辑器也太复杂了。我只想要一个具有这两个功能的非常简单的编辑器。

这是我项目的一大障碍。

无论找到什么解决方案都必须是轻量级和免费的。例如，YUI 文本编辑器可以工作，但依赖于 YUI javascript 库，该库太大且不易拆开。

Answer 1

我以前在基于 IE 的控件中完成过此操作。总结:

1. 用户选择一段文本并在您的 GUI 中选择不同的字体大小。
2. 在 JavaScript 中:
   1. 使用浏览器 DOM 获取当前文本选择对象。
   2. 创建一个新的 SPAN 元素，根据需要设置 CSS 样式的 font-size 属性(例如:12pt)。
   3. 将 SPAN 的内部文本设置为最初选择的文本。
   4. 从文档中删除选定的文本。
   5. 在同一位置插入新的 SPAN。

当然，具体情况取决于您所针对的浏览器。如果您需要使用一个库(JQuery 等)来支持许多浏览器，可能是可行的方法。

如果我没记错的话，在 IE 中，您使用 document.selection 和 selection.createRange() 来获取当前选择。

范围对象上还有一个delete()或collapse()来删除选中的文本。要插入跨度，您可以使用 insertBefore()/insertAfter() 或可能使用 range.pasteHTML()