筆記：editor.md 常用 api

YING123發表於2018-04-03
筆記API

editor.md 開源線上 Markdown 編輯器

非常好用的一個開源的markdown編輯器，但是在用的時候，居然一直沒有找到完整的 api 文件...
各種配置不詳細說，都可以查到，只記錄使用過程中使用到的api。

init之後配置更新

  • .config() // 單個更改可以寫成 .config('xxx' , xxx) , 多個可以傳一個物件

取值

  • getValue() // 取值
  • getMarkdown() // 獲取 Markdown 原始碼
  • getHTML(); // 獲取 Textarea 儲存的 HTML 原始碼
  • getPreviewedHTML(); // 獲取預覽視窗裡的 HTML，在開啟 watch 且沒有開啟 saveHTMLToTextarea 時使用
  • preview.html() // 獲取預覽區的html

設定值

  • setValue()
  • appendMarkdown() // 插入Markdown
  • setMarkdown() // 設定markdown內容

預覽

  • watch() // 開啟預覽
  • unwatch() // 關閉預覽

顯示隱藏

  • show()/hide() // 因為基於jQuery 可以直接使用

工具條

  • showToolbar()/hideToolbar() // 顯示隱藏工具條
  • setToolbarAutoFixed() // true/false 設定工具條固定

跳轉到指定行數

  • gotoLine(num)
  • gotoLine('first') // 回到第一行
  • gotoLine('last') // 調到最後一行

設定主題

  • setTheme() // 工具條主題
  • setCodeMirrorTheme() // markdown編輯區主題
  • setPreviewTheme() // 預覽區主題
  • 編輯器主題可以看官網 demo

游標位置

  • setCursor() // {line:1, ch:2} 設定游標位置
  • getCursor() // 獲取當前游標位置
  • setSelection() // {line:1, ch:0}, {line:5, ch:100} 設定選中文字
  • getSelection() // 獲取選中文字內容
  • replaceSelection('xxx') // 替換選中文字為xxx
  • insertValue('xxx') // 在游標出插入文字xxx

全屏

  • fullscreen() // 全屏預覽

內建事件

  • onload // 圖片上傳完成
  • onwatch/onunwatch // 開啟預覽/關閉預覽
  • onchange // 內容變化
  • onscroll // 滾動
  • onpreviewscroll // 預覽時滾動
  • onfullscreen/onfullscreenExit // 全屏/退出全屏
  • onresize // 尺寸變化
  • onpreviewing/onpreviewed // 預覽/退出預覽

有一些可能api，沒有用到，根據詞面意思總結，只做參考
還有好多，editor.md 功能很全，自定義也很豐富，等有時間在回來完善

相關文章