聊聊markdown编辑器—

首先上官网链接——http://pandao.github.io/editor.md/。

使用示例——http://pandao.github.io/editor.md/examples/index.html。

问：如何把大象塞进冰箱？

答：把大象塞进冰箱分三步：第一步打开冰箱门,第二步把大象塞进去，第三步关上冰箱门。

——·——·——·——·——·——·——·——·—— 华丽的分割线 ——·——·——·——·——·——·——·——·——

在html页面中引入这个编辑器的方法很简单。第一步打开冰箱门......开个玩笑...

首先在上面给出的第一个网址下载编辑器文件。

文件解压后，找到editormd.css 或 editormd.min.css文件。

找到editormd.js 或 editormd.min.js文件。

然后引入这两个文件（具体路径请参考各自文件位置）：

<link rel="stylesheet" href="../public/css/editormd.css"/>
<script src="../public/js/editormd.js"></script>

引入文件后，在后面插入这段代码（具体路径请参考各自文件位置）：

<script type="text/javascript">
//    调用编辑器
var testEditor;
$(function() {
    testEditor = editormd("test-editormd", {
        width   : "1000px",
        height  : 640,
        syncScrolling : "single",
        path    : "../public/editormd/lib/"
    });
});

最后，在html需要插入编辑器的位置插入：

<!--编辑器-->
<div id="test-editormd">
    <textarea style="display:none;" id="ts"></textarea>
</div>

这样就可以在页面中使用编辑器了。

## 如果遇到编辑器上面工具栏的图标显示不全，可以尝试把fonts文件夹放到外一层文件夹中。

## 如果想要全屏输入，可以在body中插入一个函数：

<body onload="testEditor.unwatch()">

## 如果想要全屏展示，可以在body中插入一个函数：

<body onload="testEditor.previewing()">

粗浅之语，如有不足之处，还望大家指出。

聊聊markdown编辑器——Editor.md

推荐阅读