背景
富文本編輯器在有些情況下還是沒有markdown編輯器方便烘贴,故重新整合了一個(gè)方便快捷的markdown編輯器:editor.md诅炉。
官網(wǎng)演示地址
http://editor.md.ipandao.com/examples/code-fold.html
集成
1.引入css和js
頁面中只需要引入editormd.min.css和editormd.min.js文件(注意:對(duì)于jquery相關(guān)的引用記得放在其他js之前即可)位岔。
<link rel="stylesheet" href="editormd/css/editormd.css"/>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="editormd/editormd.min.js"></script>
在通過editormd
去渲染即可玫镐。
成功案例代碼如下:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>editor.md</title>
<link rel="stylesheet" href="layui/css/layui.css">
<link rel="stylesheet" href="editormd/css/editormd.css"/>
</head>
<body>
<h1 style="text-align:center">editor.md</h1>
<div id="test-editor">
<textarea style="display:none;">
</textarea>
</div>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="editormd/editormd.min.js"></script>
<script type="text/javascript">
$(function() {
var editor = editormd("test-editor", {
width : "90%",
height : "800",
path : "editormd/lib/"
//其他樣式設(shè)置可參考官網(wǎng)告组。
});
});
</script>
</body>
</html>
over!