Javascript WYSIWYG编辑器和字体大小，我很难过

Question

我正在创建一个Javascript WYSWYG编辑器（是的，我知道已经存在了一百万，但没有一个符合我的需求）而且我已经碰壁了。

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

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 Rich Text编辑器也太复杂了。我只想要一个具有这两个功能的简单编辑器。

这是我项目的一大障碍。

无论找到什么解决方案，都必须轻巧自由。例如，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()

Answer 2

如果您需要特殊许可证，CKEditor仅需850美元。只要您尊重GPL，LGPL或MPL，您就可以在不购买任何东西的情况下使用它。 http://ckeditor.com/license

Answer 3

使用CLEditor，您可以编写一个简单的插件，用点大小值（而不是字体大小1-7）替换内置字体弹出窗口。然后使用CLEditor .selectedText（）和.execCommand（）方法（以及'inserthtml'命令）将当前选择替换为包含所选文本的span标记。这可以跨浏览器工作，非常轻量级，不应该是那么难写。

Answer 4

TinyEditor现在具有此功能。您可以按原样使用它，也可以自定义代码。看起来很干净，布局很好。

http://www.scriptiny.com/2010/02/javascript-wysiwyg-editor/