简介：
开源在线 Markdown 编辑器，推荐使用。
官网：https://pandao.github.io/editor.md/
下载安装
https://github.com/pandao/editor.md/archive/master.zip
下载解压下来的文件夹是:editor.md-master
截取的一部分
1.examples文件中是使用PHP做的所有示例(可以在文档编辑器里打开，并查看源代码)；
2.lib文件夹中是editor.md所依赖的第三方js资源；
3.plugins文件夹中是如emoji表情支持、代码格式化等插件；
在html页面嵌入编辑器
另外一个textarea
需要html格式的文本可以从这获取，name都告诉你了，该知道怎么办吧
另外一个textarea
html文件和editor.md-master文件位置
位置
更多editormd配置
width: "90%",
height: 740,
path : '../lib/',
theme : "dark", //主题
previewTheme : "dark",
editorTheme : "pastel-on-dark",
markdown : md,
codeFold : true,
//syncScrolling : false,
saveHTMLToTextarea : true, // 保存 HTML 到 Textarea
searchReplace : true,
//watch : false, // 关闭实时预览
htmlDecode : "style,script,iframe|on*", // 开启 HTML 标签解析，为了安全性，默认不开启
//toolbar : false, //关闭工具栏
//previewCodeHighlight : false, // 关闭预览 HTML 的代码块高亮，默认开启
emoji : true,
taskList : true,
tocm : true, // Using [TOCM]
tex : true, // 开启科学公式TeX语言支持，默认关闭
flowChart : true, // 开启流程图支持，默认关闭
sequenceDiagram : true, // 开启时序/序列图支持，默认关闭,
//dialogLockScreen : false, // 设置弹出层对话框不锁屏，全局通用，默认为true
//dialogShowMask : false, // 设置弹出层对话框显示透明遮罩层，全局通用，默认为true
//dialogDraggable : false, // 设置弹出层对话框不可拖动，全局通用，默认为true
//dialogMaskOpacity : 0.4, // 设置透明遮罩层的透明度，全局通用，默认值为0.1
//dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色，全局通用，默认为#fff
/**上传图片相关配置如下*/
imageUpload : true,//开启上传图片吗？
imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],//图片支持的格式
imageUploadURL : "editor.md-master/examples/php/upload.php", //处理图片上传的url
//上面这个地址是官网给定了一个处理上传图片的php的demo 当然后端的代码得自己写
onload : function() {
console.log('onload', this);
//this.fullscreen();
//this.unwatch();
//this.watch().fullscreen();
//this.setMarkdown("#PHP");
//this.width("100%");
//this.height(480);
//this.resize("100%", 640);
}
关于图片上传
首先后端自己写，还有官网给的php-demo我没成功啊。。难道我。漏了点什么。。有没有大佬实现成功的
//editor.md期望得到一个json格式的上传后的返回值，格式是这样的：
/*
{
success : 0 | 1, // 0 表示上传失败，1 表示上传成功
message : "提示的信息，上传成功或上传失败及错误信息等。",
url : "图片地址" // 上传成功时才返回
}
//返回的参数success的值不是字符串“0”和“1”，而是数字0和1，后台返回的时候一定要注意
*/
前台显示
展示内容有两种方式
- 一种方式是直接展示html格式的内容
- 第二种方式是页面加载markdown格式内容，然后通过editor.md再次渲染成html格式。
1.直接展示html
${content}
2.如果第二种：
首先引入必要JS（下面不是所有必要,官网说依赖这么多）：
然后，本页面中，加入如下DIV以及css
再加上如下js
效果预览
模拟拿数据
模拟显示md格式的文本
最后重点：你嫌上面俩种方法都麻烦？
肯定有第三方帮助我门做啊。。
上代码你就懂了：
1.老外的工具：strapdown.js 官网http://strapdownjs.com/
国外的请下载下来然后改样式路径
它的gitHub:https://github.com/arturadib/strapdown
2.showdown.min.js