官方地址 https://bh-lay.github.io/mditor/

##使用方法

#1.页面添加dom

```javascript

<textarea id="md_editor">……</textarea>

```

#2.引入js文件或者Npm安装后require

```javascript

<script type="text/javascript" src="src/jquery.js"></script>
<script type="text/javascript" src="src/mditor.js"></script>
<script type="text/javascript">
//获取textarea dom对象
var ele_textarea = document.getElementById('md_editor');
//实例化Mditor
var editor = new mditor(ele_textarea);
</script>

```

#3.高级操作

  • 实例化midtor时,可以传入自定义参数

  ```javascript

  var editor = new mditor(document.getElementById('md_editor'),{

  //自定义显示class

  previewclass:'md_test'

})

```

  • 通过js操作实例化后的midtor

  //获取html

  ```javascript

  editor.getHtml()

  ```

  //获取markdown

```javascript

  editor.getContent()

```

  //插入内容

```javascript

  editor.inset('插入inner');

```

  //进入预览

```javascript

  editor.preview();

```

  //返回编辑界面

```javascript

  editor.edit();

```

markdown在线编辑插件mditor的更多相关文章

  1. Markdown在线编辑及预览

    推荐一款不错的Markdown语法手册,最可贵的是支持在线编辑预览: Cmd Markdown简介 Cmd Markdown语法手册及在线编辑 补充一些使用技巧: MarkDown实现段首缩进:「Ma ...

  2. [前端插件]Bootstrap Table服务器分页与在线编辑应用总结

    先看Bootstrap Table应用效果: 表格用来显示数据库中的数据,数据通过AJAX从服务器加载,同时分页功能有服务器实现,避免客户端分页,在加载大量数据时造成的用户体验不好.还可以设置查询数据 ...

  3. Markdown For EditPlus插件发布(基于EditPlus快速编辑Markdonw文件,写作爱好的福音来啦)

    详细介绍: Markdown For EditPlus插件使用说明 开发缘由 特点好处: 中文版使用说明 相关命令(输入字符敲空格自动输出): EditPlus常用快捷键: 相关教程: English ...

  4. Markdown For EditPlus插件使用说明(基于EditPlus快速编辑Markdonw文件,写作爱好者的福音来啦)

    Markdown For EditPlus插件使用说明 开发缘由 特点好处: 中文版使用说明 相关命令(输入字符敲空格自动输出): EditPlus常用快捷键: 相关教程: English descr ...

  5. WordPress 前端投稿/编辑插件 DJD Site Post(支持游客和已注册用户)

    转自:http://www.wpdaxue.com/front-end-publishing.html 说到前端用户投稿,倡萌之前推荐过3个不错的插件: WordPress匿名投稿插件:DX-Cont ...

  6. 如何配置使用HTML在线编辑工具

    如何配置使用HTML在线编辑工具 为了更好的.统一的编写统一简单易用的博客,决定采用TinyMCE工具.首先下载TinyMCE4.0包.文件目录如下: 其中, Plugins是插件目录,包括各种插件 ...

  7. 【02】markdown在线编辑器

    [01]在线编辑器 https://www.zybuluo.com/mdeditor 在线 Markdown 编辑阅读器 pen - 是一个Markdown编辑器工具.demo 你可以试试这个在线的m ...

  8. handsontable在线编辑excel扩展功能-踩坑篇

    简述 先说一下背景,之所以封装handsontable插件,是因为公司要实现在线编辑导入excel文件的功能,然后我就找到了这个功能强大的插件handsontable. 具体功能 除了handsont ...

  9. 【开发者portal在线开发插件系列五】命令的响应,即命令结果的上报(mid的使用)

    基础篇 [开发者portal在线开发插件系列一]profile和基本上下行消息 [开发者portal在线开发插件系列二]多条上下行消息(messageId的使用) 基础场景见上面两个帖子,这里单独介绍 ...

随机推荐

  1. c#基础之abstract和interface

    一.abstract abstract 的词义是“抽象”,它用来定义抽象类.抽象类不能被实例化只能被继承. 定义抽象类的格式如下:public abstract ClassName{……} 注意:只有 ...

  2. 清除Windows 10的文件夹浏览痕迹

    windows 10有一个功能就是在快速访问时显示“最近访问的文件”,“常用文件”.如果是一台共用电脑,这个功能会经常暴露自己的“行踪”. 可以在“文件夹选项”-“隐私”中去掉勾选,并点击“清除”来清 ...

  3. post请求中body数据类型

    1.application/json:json格式,如下: {"input1":"xxx","input2":"ooo" ...

  4. Git随笔 -- 初始化远程仓库

    1. 新建文件夹(作为本地仓库与之远程仓库关联),进入文件夹空白处右键选择Git Bash(安装程序下载).[或者在开始菜单里找到Git Bash并打开,使用命令进入文件夹:cd 文件夹名称.] 2. ...

  5. MySQL常用dos命令

    MySQL的基本目录 登陆MySQL 查看数据库 Show databases; 创建数据库 Create database 数据库的名字; 标准创建语句: Create database if no ...

  6. Gradle构建多模块项目

    通常我在使用Maven构建项目的时候是将应用项目划分为多个更小的模块. Gradle 项目也拥有多于一个组件,我们也将其称之为多项目构建(multi-project build). 我们首先创建一个多 ...

  7. Android系统应用Mms之短信会话列表加载流程一

    1. ConversationList短息会话列表界面 1. 开始进行加载 ConversationList: protected void onStart(){ ... // 进行异步查询 star ...

  8. LintCode 521.去除重复元素

    LintCode 521.去除重复元素 描述 给一个整数数组,去除重复的元素. 你应该做这些事 1.在原数组上操作 2.将去除重复之后的元素放在数组的开头 3.返回去除重复元素之后的元素个数 挑战 1 ...

  9. Ubuntu 18.04 LTS 常用软件安装杂记

    之前个人笔记本装的是 Linux Mint,用了一段时间但是体验不佳,所以打算换成 Ubuntu .作为一个 Linux 小白,当时配置一些软件环境费了不少时间.这次打算简单记录下,和大家分享一下我的 ...

  10. 【HNOI 2018】毒瘤

    Problem Description 从前有一名毒瘤. 毒瘤最近发现了量产毒瘤题的奥秘.考虑如下类型的数据结构题:给出一个数组,要求支持若干种奇奇怪怪的修改操作(例如给一个区间内的数同时加上 \(c ...