我疯了吗？（如何）创建jQuery内容编辑器？

好的，所以我创建了一个主要针对小学的CMS。它在新西兰越来越流行，但有一件事我非常讨厌，那就是浏览器中所见即所得编辑器的质量很差。我一直在使用KTML（几年前由Adobe购买的InterAKT制作）。在我看来，这个编辑器做了很多伟大的事情（图像编辑/管理、缩略图和相当好的内容编辑）。不幸的是，这个产品在时间上遇到了麻烦，新的浏览器开始破坏它的特性，并且通常会降低这个工具的性能。把我的生计建立在一个废弃的产品上也是相当可怕的

我一直在打猎，事实上我经常四处打猎，看看所见即所得领域是否有什么变化。最让我兴奋的是WYSIHAT框架，但他们决定忽略一个非常相关的编辑范例，我将在下面概述。这是我建议的编辑的想法，我不知道有任何现有产品能够正确地做到这一点：

对，所以传统的编辑模式，比如说CMS中的页面是登录到“后端”，然后单击页面上的编辑。然后，这将加载另一个屏幕，其中包含编辑器和一些其他字段。更高级的CMS可能会有几个编辑框，用于页面的不同部分。无论如何，这种方法的一个大问题是，用户编辑文档时，文档将出现在最终上下文之外。用最简单的术语来说，这意味着页面模板。许多事情可能是错误的，例如，编辑区域的宽度可能与实际模板区域的宽度不同。高度几乎总是固定的，因为现有编辑器似乎总是使用iframe实现向后兼容性。如果你在这个发展领域，我相信你一定很清楚还有很多其他的啤酒

以下是我的编辑乌托邦：

单击“编辑页面”：显示实际页面（及其实际模板）。页面的某些部分已通过类名标记为可编辑。你点击这些区域中的一个（在我的例子中，它只是模板中间的一个大的‘身体’区域），一个编辑栏从屏幕的顶部从你的所有标准控件（粗体、斜体、插入图像等）下落。Iframe从未使用过，相反，我们依赖于在所讨论的DIV上将contentEditable设置为true。Firefox2和IE6可能会消失，让我们继续前进。您可以编辑页面，知道保存时页面的外观。由于此模板的所有样式都已加载，因此您的标题将看起来正确，所有内容都将非常漂亮。这是一个如此激进的概念吗？为什么我们仍然满足于TinyMCE和那个因为听起来像脏话而令人尴尬的编辑器

让我们面对事实：

我是JavaScript新手。我曾经使用SitePoint的Javascript文集作为指导，在这方面进行过一次尝试。这是一次很酷的学习经历，但他们当然使用IFRAME让生活更轻松。我试着走另一条路，只使用contentEditable，甚至试着避开本机内容编辑例程（execCommand），而是编写自己的。他们有点工作，但总有一些问题

现在我们有了jQuery和一些库，它们抽象了IE缺乏范围支持之类的东西。我想知道，我疯了吗？或者，尝试使用jQuery和相关插件围绕这种编辑范式构建一个编辑器，使工作更容易，这实际上是一个好主意吗

我的实际问题是：

• 你从哪里开始
• 什么插件
  你知道这会有助于解决问题吗
  大多数
• 这值得吗，还是有一个
  已经存在的神奇项目
  我应该参加吗

• 在一个项目中要克服的最大障碍是什么
  像这样的计划

• 我疯了吗

我希望这个问题已经贴在了正确的黑板上。我想这是一个技术问题，因为我想知道需要注意的具体障碍和陷阱，以及它在当今技术中是否在技术上可行

期待听到人们的想法和意见

更新

我已经决定尝试一下，当我有一些很酷的东西可以看的时候，我会为它启动一个github项目。从那以后，我将非常高兴人们能提供任何帮助。它当然是开源的：）

更新2

我已经完成了这个项目，并概述了目标。如果你想以贡献者的身份加入项目组，请告诉我，但我会先了解基本情况，这样就有了一些开始

以下是链接：http://github.com/brendon/SpikeEdit

更新3

哇！我找到了这个项目。多酷的主意！我正在和他联系，看看他是否有过这样的经历：

http://www.fluffy.co.uk/stediting

更新4

好吧，我走得相当远。最大的问题（每个人都知道）是如何使生成的代码处于合理的状态。WYSIHAT似乎已经考虑了整个非IFRAME的事情，所以我暂且不谈，看看它能走多远。他们采取的方法是在编辑周期结束时清理代码。我认为应该在飞行中清理它，否则你会把自己编辑成一个泥潭（我做过几次）。当我有时间的时候，我将研究某种同质化引擎，它可以被插入，以使编辑过程在所有现代浏览器中表现得尽可能相似