简易Markdownd编辑器

使用

预览MDEditor | MDEditor for Githubjavascript

  • 添加 MDEditor.min.css 样式css

  • 添加 MDEditor.min.js 并非 lib/MDEditor.jshtml

  • 添加编辑器初始节点java

  • 若是预加载长篇markdown文本必须嵌套 <textarea> 标签git

<link rel="stylesheet" type="text/css" href="../themes/default/css/MDEditor.min.css">
<script type="text/javascript" src="../build/MDEditor.min.js"></script>
<div id="mdeditor">
<textarea># 这里放markdown初始值
- id: 节点id
- minheight: 初始化编辑器高度
- maxheight: 编辑器随着输入内容增多而变高,这个值是它的最大值
- value: 默认编辑器中显示markdown内容
</textarea>
</div>
<script type="text/javascript">
var mde = new MDEditor({
    id:"#mdeditor",
    minheight:300,
    maxheight:600,
    value:"#多多少少的"
}).load().input(function(evn,opts){
    console.log("evn:",evn)
    console.log("opts:",opts)
})
</script>

MDEditor初始化

  • id: 节点idgithub

  • minheight: 初始化编辑器高度markdown

  • maxheight: 编辑器随着输入内容增多而变高,这个值是它的最大值编辑器

  • value: 默认编辑器中显示markdown内容ui

load

加载编辑器spa

mde.load()

preview

默认展现预览界面

mde.preview()

input

输入事件,在编辑器里面输入内容就会执行input方法

mde.input(function(evn,opts){
    console.log("evn:",evn)
    console.log("opts:",opts)
})

getMD

获取markdown的字符串

mde.getMD()  //=>返回markdown字符串

setMD

设置markdown的字符串

mde.setMD(val)

getHTML

获取生成的HTML

mde.getMD()  //=>返回HTML字符串

setHTML

设置预览的HTML

mde.setHTML(val)

关注公众号

图片描述

相关文章
相关标签/搜索