插件名：editor.md
下載地址：https://pandao.github.io/editor.md/examples/index.html
適用版本：version v1.5.0
日期：2016年11月
需要引入：jquery.min.js

插件目錄結(jié)構(gòu)：

注釋：紅色箭頭標(biāo)注關(guān)鍵目錄

前端引用css：

<link rel="stylesheet" href="css/editormd.css" />

html文本框設(shè)置：

<div id="test-editormd"><textarea name="content" style="display:none;"></textarea> </div>

前端引用js：

<script src="editormd.js"></script>

引用代碼片段：

var testEditor;$(function() {$.get("examples/test.md", function(md){testEditor = editormd("test-editormd", {width: "98%",height: 730,path : 'lib/',markdown : md,codeFold : true,saveHTMLToTextarea : true,searchReplace : true,htmlDecode : "style,script,iframe|on*",emoji : true,taskList : true,tocm : true, // Using [TOCM]tex : true, // 開(kāi)啟科學(xué)公式TeX語(yǔ)言支持，默認(rèn)關(guān)閉flowChart : true, // 開(kāi)啟流程圖支持，默認(rèn)關(guān)閉sequenceDiagram : true, // 開(kāi)啟時(shí)序/序列圖支持，默認(rèn)關(guān)閉,imageUpload : true,imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],imageUploadURL : "examples/php/upload.php",onload : function() {console.log('onload', this);}});}); })

注意：要放在本地環(huán)境里嘗試不然沒(méi)有效果哦！另外推薦一個(gè)源碼站點(diǎn)，原創(chuàng)源碼庫(kù)，大家可以看看。推薦！

讀取markdown顯示引入css文件：

<link rel="stylesheet" href="css/editormd.css" />

讀取markdown顯示html實(shí)例：

<div id="wordsView"><textarea style="display:none;" name="editormd-markdown-doc">這里寫(xiě)入md格式內(nèi)容</textarea> </div>

讀取markdown顯示前端js調(diào)用

<script src="lib/marked.min.js"></script> <script src="lib/prettify.min.js"></script> <script src="lib/raphael.min.js"></script> <script src="lib/underscore.min.js"></script> <script src="lib/sequence-diagram.min.js"></script> <script src="lib/flowchart.min.js"></script> <script src="lib/jquery.flowchart.min.js"></script> <script src="editormd.js"></script> <script type="text/javascript">$(document).ready(function() {var wordsView;wordsView = editormd.markdownToHTML("wordsView", {htmlDecode : "style,script,iframe", // you can filter tags decodeemoji : true,taskList : true,tex : true, // 默認(rèn)不解析flowChart : true, // 默認(rèn)不解析sequenceDiagram : true, // 默認(rèn)不解析});}) </script>

總結(jié)

以上是生活随笔為你收集整理的editor.md国产markdown编辑器使用实例的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。