微信登录

插件 - Markdown - Editor.md使用

作用:markdown编辑器和显示器

参考:http://editor.md.ipandao.com/
参考:https://github.com/pandao/editor.md

内容加载到显示页面
markdown

内容加载到编辑页面
appendMarkdown

  1. {
  2. mode : "gfm", // gfm or markdown
  3. name : "", // Form element name for post
  4. value : "", // value for CodeMirror, if mode not gfm/markdown
  5. theme : "", // Editor.md self themes, before v1.5.0 is CodeMirror theme, default empty
  6. editorTheme : "default", // Editor area, this is CodeMirror theme at v1.5.0
  7. previewTheme : "", // Preview area theme, default empty
  8. markdown : "", // Markdown source code
  9. appendMarkdown : "", // if in init textarea value not empty, append markdown to textarea
  10. width : "100\%",
  11. height : "100\%",
  12. path : "./lib/", // Dependents module file directory
  13. pluginPath : "", // If this empty, default use settings.path + "../plugins/"
  14. delay : 300, // Delay parse markdown to html, Uint : ms
  15. autoLoadModules : true, // Automatic load dependent module files
  16. watch : true,
  17. placeholder : "Enjoy Markdown! coding now...",
  18. gotoLine : true, // Enable / disable goto a line
  19. codeFold : false,
  20. autoHeight : false,
  21. autoFocus : true, // Enable / disable auto focus editor left input area
  22. autoCloseTags : true,
  23. searchReplace : true, // Enable / disable (CodeMirror) search and replace function
  24. syncScrolling : true, // options: true | false | "single", default true
  25. readOnly : false, // Enable / disable readonly mode
  26. tabSize : 4,
  27. indentUnit : 4,
  28. lineNumbers : true, // Display editor line numbers
  29. lineWrapping : true,
  30. autoCloseBrackets : true,
  31. showTrailingSpace : true,
  32. matchBrackets : true,
  33. indentWithTabs : true,
  34. styleSelectedText : true,
  35. matchWordHighlight : true, // options: true, false, "onselected"
  36. styleActiveLine : true, // Highlight the current line
  37. dialogLockScreen : true,
  38. dialogShowMask : true,
  39. dialogDraggable : true,
  40. dialogMaskBgColor : "#fff",
  41. dialogMaskOpacity : 0.1,
  42. fontSize : "13px",
  43. saveHTMLToTextarea : false, // If enable, Editor will create a <textarea name="{editor-id}-html-code"> tag save HTML code for form post to server-side.
  44. disabledKeyMaps : [],
  45. onload : function() {},
  46. onresize : function() {},
  47. onchange : function() {},
  48. onwatch : null,
  49. onunwatch : null,
  50. onpreviewing : function() {},
  51. onpreviewed : function() {},
  52. onfullscreen : function() {},
  53. onfullscreenExit : function() {},
  54. onscroll : function() {},
  55. onpreviewscroll : function() {},
  56. imageUpload : false, // Enable/disable upload
  57. imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
  58. imageUploadURL : "", // Upload url
  59. crossDomainUpload : false, // Enable/disable Cross-domain upload
  60. uploadCallbackURL : "", // Cross-domain upload callback url
  61. toc : true, // Table of contents
  62. tocm : false, // Using [TOCM], auto create ToC dropdown menu
  63. tocTitle : "", // for ToC dropdown menu button
  64. tocDropdown : false, // Enable/disable Table Of Contents dropdown menu
  65. tocContainer : "", // Custom Table Of Contents Container Selector
  66. tocStartLevel : 1, // Said from H1 to create ToC
  67. htmlDecode : false, // Open the HTML tag identification
  68. pageBreak : true, // Enable parse page break [========]
  69. atLink : true, // for @link
  70. emailLink : true, // for email address auto link
  71. taskList : false, // Enable Github Flavored Markdown task lists
  72. emoji : false, // :emoji: , Support Github emoji, Twitter Emoji (Twemoji);
  73. // Support FontAwesome icon emoji :fa-xxx: > Using fontAwesome icon web fonts;
  74. // Support Editor.md logo icon emoji :editormd-logo: :editormd-logo-1x: > 1~8x;
  75. tex : false, // TeX(LaTeX), based on KaTeX
  76. flowChart : false, // flowChart.js only support IE9+
  77. sequenceDiagram : false, // sequenceDiagram.js only support IE9+
  78. previewCodeHighlight : true, // Enable / disable code highlight of editor preview area
  79. toolbar : true, // show or hide toolbar
  80. toolbarAutoFixed : true, // on window scroll auto fixed position
  81. toolbarIcons : "full", // Toolbar icons mode, options: full, simple, mini, See `editormd.toolbarModes` property.
  82. toolbarTitles : {},
  83. toolbarHandlers : {
  84. ucwords : function() {
  85. return editormd.toolbarHandlers.ucwords;
  86. },
  87. lowercase : function() {
  88. return editormd.toolbarHandlers.lowercase;
  89. }
  90. },
  91. toolbarCustomIcons : { // using html tag create toolbar icon, unused default <a> tag.
  92. lowercase : "<a href=\"javascript:;\" title=\"Lowercase\" unselectable=\"on\"><i class=\"fa\" name=\"lowercase\" style=\"font-size:24px;margin-top: -10px;\">a</i></a>",
  93. "ucwords" : "<a href=\"javascript:;\" title=\"ucwords\" unselectable=\"on\"><i class=\"fa\" name=\"ucwords\" style=\"font-size:20px;margin-top: -3px;\">Aa</i></a>"
  94. },
  95. toolbarIconTexts : {},
  96. lang : { // Language data, you can custom your language.
  97. name : "zh-cn",
  98. description : "开源在线Markdown编辑器<br/>Open source online Markdown editor.",
  99. tocTitle : "目录",
  100. toolbar : {
  101. //...
  102. },
  103. button: {
  104. //...
  105. },
  106. dialog : {
  107. //...
  108. }
  109. //...
  110. }
  111. }