惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

D
Docker
人人都是产品经理
人人都是产品经理
小众软件
小众软件
博客园 - Franky
WordPress大学
WordPress大学
Jina AI
Jina AI
Google DeepMind News
Google DeepMind News
I
InfoQ
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
F
Fortinet All Blogs
博客园 - 【当耐特】
IT之家
IT之家
G
Google Developers Blog
J
Java Code Geeks
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
云风的 BLOG
云风的 BLOG
Recent Announcements
Recent Announcements
有赞技术团队
有赞技术团队
V
Visual Studio Blog
U
Unit 42
阮一峰的网络日志
阮一峰的网络日志
月光博客
月光博客
GbyAI
GbyAI
雷峰网
雷峰网

浮华生

Elasticsearch 检索性能优化 - 浮华生 舆情监控系统综述 - 浮华生 2024 半年度总结 - 浮华生 2023 年终总结 - 浮华生 异地机器组网方案 - 浮华生 Kubernetes 部署 Elasticsearch 和 Kibana - 浮华生 2022 年终总结 - 浮华生 RabbitMQ connection channel 的关系 - 浮华生 Kafka Java 客户端 Producer 原理分析 - 浮华生 RabbitMQ 和 Kafka 应用原理简单对比 - 浮华生 阿里云 OpenSearch 介绍 - 浮华生 Golang Array 和 Slice 区别 - 浮华生 Mac OS 下打造 golang nvim 编程环境之基础配置 - 浮华生 电商搜索技术总结 - 浮华生 电商搜索业务总结 - 浮华生 2021 年终总结 - 浮华生 Cypress 实践总结 - 浮华生 年终总结 - 浮华生 关于我 - 浮华生 使用 cucumber 进行行为驱动开发(BDD) - 浮华生 微服务应用集成 SpringCloud 步骤 - 浮华生 电商搜索数据同步方案 - 浮华生 通过一道数值转换题重温计算机补码 - 浮华生 macOS 系统推荐的一些软件 - 浮华生 DevOps 实施规划(持续更新) - 浮华生 rabbitmq 如何提高可靠性并保证消费端幂等 - 浮华生 AMQ Model总结 - 浮华生 结对编程 - 浮华生 RSocket 介绍 - 浮华生 面向对象的理解 - 浮华生
editor.md 富文本编辑器的使用 - 浮华生
浮华生 · 2018-01-30 · via 浮华生

editormd 是一款国产的软件,虽然很久没更新了,但其所实现的功能已满足日常使用,下面主要讲使用时需要注意的点。

在 Body 中写两个文本域便于保存,注意 class

1
2
3
4
5
<div id="articlemd" style="margin-top: 10px">
                <textarea class="editormd-markdown-textarea" name="content"></textarea>
                <!-- 第二个隐藏文本域,用来构造生成的HTML代码,方便表单POST提交,这里的name可以任意取,后台接受时以这个name键为准 -->
                <textarea class="editormd-html-textarea" name="editorhtml"></textarea>
            </div>

在取编辑器中的几行内容是用到的是下面的 JavaScript 方法

1
2
var summary = testEditor.setSelection({line: 0, ch: 0}, {line: 4, ch: 100});
summary.getSelection();

取得编辑器中所有的内容,以便保存到数据库中,注意数据库最好保存的是 Markdown 格式的。

1
2
var content = testEditor.getMarkdown();

在前台显示数据时,调用解析器如下,注意ID值要和 JavaScript 代码对应

1
2
3
4
  <div class="blog_content" id="content">

            <textarea style="display:none;" name="editormd-markdown-doc"> ${blog.content}</textarea>
 </div>
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

    $(document).ready(function () {
        var wordsView;
        wordsView = editormd.markdownToHTML("content", {
            htmlDecode: "style,script,iframe",  // you can filter tags decode
            emoji: true,
            taskList: true,
            tex: true,  // 默认不解析
            flowChart: true,  // 默认不解析
            sequenceDiagram: true,  // 默认不解析
        });

    })

目前就这么多,想起来再补充。