官方地址 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. 2018-2019-2 《网络对抗技术》Exp2 后门原理与应用 20165215

    目录 实验内容 基础问题回答 常用后门工具 Netcat windows 获取 linux 的shell linux 获取 winsdows 的shell 使用nc传输数据 使用nc传文件 Socat ...

  2. nginx 环境不支持thinkPHP

    在linux+Nginx+mysql+PHP 新装的服务器下,不支持重写pathinfo功能 . 需要加入这个代码 让Nginx 支持重写功能 location / { if (!-e $reques ...

  3. Java SE中的Synchronized

    1 引言 在多线程并发的编程中Synchronized一直是元老级的角色,很多人会称呼它为重量级锁,但是随着Java SE1.6对Synchronized进行了各种优化以后,有些情况下它并不那么重了. ...

  4. webservice生成客户端代码

    wsimport -d C:\Other\WSDL_JAVA_Code -keep -verbose -Xauthfile C:\Other\.txt http://XXXXXX

  5. js中创建对象的4种方法

    1.直接创建,不可复用式创建var obj = new Object(); obj.name = ""; obj.id = ""; 2.使用工厂方法来创建对象, ...

  6. oracle传输表空间相关

    1.convert tablespaceconvert tablespace源端库执行:convert tablespace 'TPS_DATA' to platform 'AIX-Based Sys ...

  7. bzoj 4770 图样 - 概率与期望 - 动态规划

    题目传送门 传送门I 传送门II 题目大意 有一个$n$个点的完全图,每个点的权值是$[0, 2^{m})$中的随机整数,两点间的边的权值是两点点权的异或和,问它的最小异或生成树的边权和的期望. 考虑 ...

  8. qt界面操作

    //控制死窗体 int width = this->geometry().width(); int height = this->geometry().height(); this-> ...

  9. vscode打开django项目pylint提示has not "object" member

    vscode 打开 django 项目提示 has not "object" member 是因为 Django 动态地将属性添加到所有模型类中,所以 ide 无法解析. 解决方案 ...

  10. 移动web端在线观看ppt

    使用office online 移动端重定向地址,重定向地址生成方式(对ppt地址进行两次编码),代码如下.将代码中http://video.ch9.ms/build/2011/slides/TOOL ...