我们应该使用哪种堆栈溢出样式标记(WMD) JavaScript编辑器？

Question

背景

我正在开发一个需要用户输入内容的应用程序，我决定使用堆栈溢出样式的Markdown编辑器。在最近几天研究这个主题之后，我意识到基本的大规模毁灭性武器编辑器有很多分叉，有些有一些基本的增强，有些与堆栈溢出有很大的不同。

因为这将是应用程序的核心，所以我想从我能做的最好的代码库开始。如果有人能推荐其中哪一个最适合我的需求，我会很高兴的。

下面是需求，再加上我已经找到的东西。我希望这个问题能帮助我决定使用哪个版本，也许可以帮我找到一个更适合我需求的端口。

我的项目的要求

• 现场预览
• 同一页面上的多个编辑器(我不知道预先有多少编辑器，因为用户可以动态添加另一个编辑框)。
• 能够扩展额外的按钮(我想要一个按钮上传图片，而不是仅仅添加一个img网址)。
• 能够动态显示/隐藏编辑框(并且只查看预览框)。
• 这并不是绝对必须的，但我更愿意像Stack known的外观和感觉一样，因为它是众所周知的。
• 不知道这是否重要，但是后端是用Django编写的。

我看过的编辑

下面是我看过的一些代码库，并给出了一些想法。显然，我可能错过了另一个解决方案。

• 去皮素版本。据我所知，这是正式的堆栈溢出版本。似乎它不支持一个页面上的多个编辑器。
• jQuery.MarkEdit。看起来非常好，但与Stack溢出版本非常不同。
• MooWMD。现在看起来就像胜利者，但我有点担心，因为它看起来不像MarkEdit那么活跃/不易攻击。
• 大规模毁灭性武器-新的版本。不确定，看起来像一个没有太多用处的老代码库。
• SocialSite分支。好像不是给公众用的。

Answer 1

嗯，这个问题(和解决方案)已经很老了，所以我想也许我应该把最新的东西放在这里。:)

这是2014年初，当我遇到同样的问题时，我最终使用了PageDown-Bootstrap。这是一个基于Twitter引导的大规模毁灭性武器编辑器，具有完全可定制的样式栏(Button Bar)。

还有一种叫做引导-标记的替代方案，它看起来也很有前途。

Answer 2

对于实时预览部分，摊牌库非常容易使用(正如Edan指出的，代码库中包含)

您可以这样使用它(如果您不想使用jQuery，则不需要使用它)

$(document).ready(function(){
    var converter = new Attacklab.showdown.converter();
    function update_description_preview(){
        $('#description-preview').html(converter.makeHtml($("#id_description").val()));
    }
    update_description_preview();

    $("#id_description").keyup(function(){
        update_description_preview();
    });
});

update_description_preview函数使用转换器对象读取#id_description元素中的标记，并将其转储到#description-预览元素中。

在这里，在定义函数以初始化预览窗口(编辑器中预先加载了一些文本)之后，我立即调用该函数。

最后一点就是用keyup事件注册函数。

Answer 3

不确定它是否完全符合旧的需求，但2014年可用的另一种解决方案是开源Markdown编辑器，它在Apache2.0下拥有预览许可，并由topten软件创建。

在线演示可在这里获得：http://www.toptensoftware.com/markdowndeep/dingus