官方案例:html-preview-markdown-to-html.html 输出后台数据显示在前端,格式化内容
<div id="layout"> <div class="layui-form-item"> <h2 th:text="${article.title}"></h2> </div> <label class="layui-form-label">分类</label> <div class="layui-input-block"> <label class="layui-form-label" th:each="enum:${articleEnum}" th:if="${enum.id eq article.type}" th:value="${enum.id}" th:text="${enum.name}"></label> </div> </div> <div id="test-editormd-view"> <textarea style="display:none;" name="textContent" th:text="${article.textContent}"> </textarea> <!-- 第二个隐藏文本域,用来构造生成的HTML代码,方便表单POST提交,这里的name可以任意取,后台接受时以这个name键为准 --> <!--<textarea id="text" class="editormd-html-textarea" name="content"></textarea>--> </div> </div> <div class="layui-form-item"> </div> </form> <script src="js/jquery.min.js" th:src="@{/editmd/js/jquery.min.js}"></script> <script src="/lib/layui/layui.js" charset="utf-8"></script> <script src="../lib/marked.min.js" th:src="@{/editmd/lib/marked.min.js}"></script> <script src="../lib/prettify.min.js" th:src="@{/editmd/lib/prettify.min.js}"></script> <script src="../lib/raphael.min.js" th:src="@{/editmd/lib/raphael.min.js}"></script> <script src="../lib/underscore.min.js" th:src="@{/editmd/lib/underscore.min.js}"></script> <script src="../lib/sequence-diagram.min.js" th:src="@{/editmd/lib/sequence-diagram.min.js}"></script> <script src="../lib/flowchart.min.js" th:src="@{/editmd/lib/flowchart.min.js}"></script> <script src="../lib/jquery.flowchart.min.js" th:src="@{/editmd/lib/jquery.flowchart.min.js}"></script> <script src="../editormd.min.js" th:src="@{/editmd/editormd.min.js}"></script> <script type="text/javascript"> $(function() { var testEditormdView; testEditormdView = editormd.markdownToHTML("test-editormd-view", { htmlDecode : "style,script,iframe", // you can filter tags decode emoji : true, taskList : true, tex : true, // 默认不解析 flowChart : true, // 默认不解析 sequenceDiagram : true, // 默认不解析 }); }); </script> <script type="text/javascript"> layui.use(\['form','layer'\], function(){ var form = layui.form; var layer = layui.layer; }); </script> </body>
手机扫一扫
移动阅读更方便
你可能感兴趣的文章
4
5
6
7
8
9
10