一个常见的在线 markdown 编辑器布局如下：
<div id='editor-column'>
<textarea id="mdeditor">{{ content }}</textarea>
</div>
<!-- 预览区 -->
<div id='preview-column'>
<div id="preview"></div>
</div>
打开后如下：
图片
左边是编辑区，右边是预览区。
现在需要在左边输入时，右边预览区实时更新，效果如下：
图片
具体实现如下：
这里用到了 showdown 库，github地址：https://github.com/showdownjs/showdown
$(function(){
showdown.setOption('simpleLineBreaks', true);
var converter = new showdown.Converter();
// mdeditor 变化时，进行转换
$('#mdeditor').on('input', function() {
var to_html = converter.makeHtml($(this).val());
$('#preview').html(to_html);
});
