簡易Markdownd編輯器

使用

預覽MDEditor | MDEditor for Github

• 添加MDEditor.min.css樣式

  </li>

• 添加MDEditor.min.js并不是 ~~lib/MDEditor.js~~ 哦

  </li>

• 添加編輯器初始節點

  </li>

• 如果預加載長篇markdown文本必須嵌套<textarea>標簽

  </li> </ul>

  <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)