原创

editormd文章详情页怎么读取转换


editormd文章详情页怎么读取转换成可是话的img标签p标签等。相信很多新手使用的时候回遇到这个问题,下面我来给大家讲讲我是怎么使用的。前提是您的所有的css js等都已经部署好了[部署步骤 省略]

1:在头部引入css

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

2:页脚引入js

  1. <script src="__STATIC__/index/editormd/lib/marked.min.js"></script>
  2. <script src="__STATIC__/index/editormd/lib/prettify.min.js"></script>
  3. <script src="__STATIC__/index/editormd/lib/raphael.min.js"></script>
  4. <script src="__STATIC__/index/editormd/lib/underscore.min.js"></script>
  5. <script src="__STATIC__/index/editormd/lib/sequence-diagram.min.js"></script>
  6. <script src="__STATIC__/index/editormd/lib/flowchart.min.js"></script>
  7. <script src="__STATIC__/index/editormd/lib/jquery.flowchart.min.js"></script>
  8. <script src="__STATIC__/index/editormd/editormd.js"></script>

3:创建div容器

  1. <p id="content_detail">
  2. <textarea name="info" id="info" style="width:68%;height:600px;visibility:hidden;resize:none;">{$res.info}</textarea>
  3. </p>

注意p标签的id 和textarea的id

4:js转换

  1. <script>
  2. $(function() {
  3. var testEditormdView, testEditormdView2;
  4. testEditormdView2 = editormd.markdownToHTML("content_detail", {
  5. htmlDecode : "style,script,iframe", // you can filter tags decode
  6. emoji : true,
  7. taskList : true,
  8. tex : true, // 默认不解析
  9. flowChart : true, // 默认不解析
  10. sequenceDiagram : true, // 默认不解析
  11. });
  12. });
  13. </script>

至此完成详情页面的展示,其他方式及api请参考官方文档

留言反馈
问题反馈渠道,如有软件无法下载或者其他问题可反馈。【由于某种原因,目前留言不展示】
用户需要登录后才能留言反馈