Editor.md安装使用（markdown)
下载
Editor.md官方下载
写markdown
1. 引入JS和CSS
<link rel="stylesheet" href="${ctx}/mdeditor/css/editormd.css"><script type="text/javascript" src="${ctx}/js/jquery-3.3.1.min.js"></script><script type="text/javascript" src="${ctx}/mdeditor/editormd.min.js"></script>
引入两个JS和一个CSS
2. html
<div id="my-editormd" ></div>
3.JS
var myEditor = editormd("my-editormd", {//注意1：这里的就是上面的DIV的id属性值width : "90%",height : 640,syncScrolling : "single",path : "${ctx}/mdeditor/lib/",//下边特别讲解saveHTMLToTextarea : true,//注意3：这个配置，方便post提交表单/**上传图片相关配置如下*/imageUpload : true,imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp","PNG","JPEG","GIF","BMP","JPG","WEBP"],imageUploadURL : "${ctx}/blog/uploadImg.wj",//注意你后端的上传图片服务地址});
4.效果（就如我在写这篇文章）
5.取值
myEditor为上方JS中属性名称
myEditor.getMarkdown()；//获取markdown值
myEditor.getHTML()；//获取html值
6.问题
(1)如写成如下代码：
<form action="" method=""><div id="my-editormd"></div><input type="submit" value="提交"/>
</form>
提交的表单name为：
markdown值：name="my-editormd-markdown-doc"
html值：name="my-editormd-html-code"
(2)上方JS中path属性要设置为自己的包路径，不然可能会报404。
显示markdown
1.引入JS和CSS
<link rel="stylesheet" href="${ctx}/mdeditor/css/editormd.css"><script type="text/javascript" src="${ctx}/js/jquery-3.3.1.min.js"></script><script src="${ctx}/mdeditor/lib/marked.min.js"></script><script src="${ctx}/mdeditor/lib/prettify.min.js"></script><script src="${ctx}/mdeditor/lib/raphael.min.js"></script><script src="${ctx}/mdeditor/lib/underscore.min.js"></script><script src="${ctx}/mdeditor/lib/sequence-diagram.min.js"></script><script src="${ctx}/mdeditor/lib/flowchart.min.js"></script><script src="${ctx}/mdeditor/lib/jquery.flowchart.min.js"></script><script src="${ctx}/mdeditor/editormd.min.js" type="text/javascript" charset="utf-8"></script>
2.html
3.JS
var testEditor = editormd.markdownToHTML("content", {//注意：这里是上面DIV的idhtmlDecode: "style,script,iframe",emoji: true,taskList: true,tex: true, // 默认不解析flowChart: true, // 默认不解析sequenceDiagram: true, // 默认不解析codeFold: true});
搞定！
markdown显示遇到的问题
最开始，我markdown显示中2.html不是贴的图片，是用的源码，但是显示出错，我排查了其他错误，发现是因为，我贴的源码中name="content-markdown-doc"或是id="content"与 服务器端源码冲突了，导致解析出错。
更多咨询欢迎访问http://www.iamwj.com
iamwj : 我是魏杰
Editor.md安装使用（markdown)相关推荐
- Vue + editor.Md 双向数据绑定Markdown编辑器（vue-editormd-wrap）
Vue + editor.Md 双向数据绑定组件(vue-editormd-wrap) 先贴上组件的npm主页和源码,如果有下载了开发过程中build版本的用户,将无法使用,请更新为最新版就可以正常使 ...
- 在HTML页面中引用Markdown编辑器（Editor.md）
目录 1.下载Ediotor.md 2.引入Ediotor.md 3.确定Ediotor.md在哪里显示 最近写博客项目,用到了Markdown编辑器,这里介绍一款国内好用的Markdown编辑器:E ...
- Markdown编辑器editor.md的使用
目录(?)[-] 一Markdown和editormd简介 二editormd的使用 1下载 2简单使用 21在自己的页面上引入相关的css和js代码如下 22在自己的页面中加上DIV 23在同页面中 ...
- Markdown编辑器Editor.md插件的使用
官网: Editor.md - 开源在线 Markdown 编辑器 (pandao.github.io)https://pandao.github.io/editor.md/index.html配置项 ...
- 工具使用-Editor.md编辑器
文章目录 前言 一.环境 二.环境搭建 三.创建编辑器 前言 记录一下编辑器的安装使用过程,可能会有错误 editor.md是一个markdown编辑器,可至github下载它的发行版本 百度看见有它 ...
- Wiz Editor md 为知笔记 Markdown 插件
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章.分享知识,造福人民,实现我们中华民族伟大复兴! Wiz. ...
- editor.md中markdown编辑器的实现
markdown编辑器我觉得用起来非常的方便,故我就想实现一个简单的markdown编辑器 1.下载editor.md插件 git地址:https://github.com/pandao/edit ...
- Editor.md 的Markdown 编辑器集成与使用（全）
在这之前使用的编辑器是ueditor,是百度的:现在记录一下已经集成有段时间的 Editor.md 的 md 编辑器,确实好用! 在这之前,有个问题,数据库是保存 md 的还是保存 html 的,在网 ...
- VUE3集成Markdown编辑器（http://editor.md.ipandao.com/）
目录 背景信息 Editor.md是2015年开源的项目,那时还没有VUE3版本,所以网上也较少VUE3集成Editor.md的示例.不过还是有些大牛分享了集成的方法. 集成方法 1.下载和安装edi ...
最新文章
- asp mysql 更新数据_Asp更新数据库的几种方法
- 【机器学习】Github8.9K，目前最佳模型解释器-LIME！
- mysql二进制日志格式对复制的影响
- SpringBoot-异常处理
- java this关键字的使用_Java this 关键字的使用方法详解
- x(x-1)表达式的意义
- angular模板加载 ----ng-template
- 【路径规划】基于matlab模拟退火算法求解火灾巡逻最短路径问题【含Matlab源码 252期】
- 如何打造一款三消类游戏
- android银联支付
- 全球手机芯片产业格局未定，LTE和中国是最大变数
- 入门行人重识别 尝试跑(郑哲东 简单行人重识别代码到88%准确率)过程
- python写水仙花的作文_怎样背英语单词才高效？
- Android手机通用电池校正方法
- java jtextfield 改变_java – 如何更改JTextField的值？
- 光纤通信系统中的端到端的学习：概念和收发机设计
- FTP mget命令
- eclipse创建maven项目时出现Could not calculate build plan 错误解决方法
- Golang并发操作入门
- 头插法建立单链表educoder