javascript - 具有实时格式化功能的 Markdown 编辑器

Question

我想创建一个具有有限所见即所得格式的在线 Markdown 编辑器。如果您熟悉 iA Writer ，我正在尝试创建一个类似于他们的桌面版本的编辑器。在大多数情况下，它只是一个简单的文本编辑器，但它做了一些我试图复制的时髦的事情。

• 自动用*斜体*、**粗体**、***粗体斜体***
• 缩进 ">" block 引号
• Outdents“#”标题和“-”列表，以便文本左对齐，就像在旧的三孔打洞线纸上一样，您可以将文本与红线对齐并将列表编号放在它的左侧。

我对如何着手实现这个有一些想法，但我对每个想法都遇到了一些担忧。

可编辑的 iFrame

• 如何缩进文本或对其应用 css 类
• 格式设置是自动进行的，那么我该如何更改文本的选择，重新设置格式，然后返回到原始选择位置
• 我听说您可以将另一个页面加载到您的可编辑 iFrame 中以执行更多高级功能，但我对此不太熟悉 - 有什么好的资源吗？

纯javascript

• 如何在区域中创建闪烁的光标，因为我认为我无法在输入或文本区域中执行此操作...
• 可能使每一行成为一个 div，当我点击它时它会转换成一个输入框(类似于当你提问时标签框在标签框上的工作方式(尽管不适用于内联格式)

对我如何做这样的事情有什么建议吗？

Answer 1

一个好的开始是查看 Code Mirror (http://codemirror.net/)，它已经提供了 Markdown 编辑器和强大的 API。

您应该能够在其上添加功能和实时渲染。