簡易Markdownd編輯器

使用

預覽MDEditor | MDEditor for Github

• 添加 MDEditor.min.css 樣式

• 添加 MDEditor.min.js 並非 lib/MDEditor.js 哦

• 添加編輯器初始節點

• 若是預加載長篇markdown文本必須嵌套 <textarea> 標籤

<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: 節點id

• minheight: 初始化編輯器高度

• maxheight: 編輯器隨着輸入內容增多而變高，這個值是它的最大值

• value: 默認編輯器中顯示markdown內容

load

加載編輯器

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)

關注公衆號