## Markdown编辑器
内部使用 [editor.md](https://pandao.github.io/editor.md/) 开源编辑器实现。
[TOC]
## 使用方法
![](https://box.kancloud.cn/fde79123a61cceb282225aed790c413c_1406x734.png)
~~~
<div id="editormd"><textarea name="content" hidden>初始内容</textarea></div>
<script>
require(['hdjs'], function (hdjs) {
hdjs.markdown("editormd", {
width: '100%',
heigth: 300,
callback:function(editormd){
//编辑器对象
console.log(editormd);
}
});
});
</script>
~~~
第二个参数是选项,可以根据需要自行设置其他选项
## 显示内容
~~~
<script>
require(['hdjs', 'marked', 'highlight'], function (hdjs, marked) {
marked.setOptions({
renderer: new marked.Renderer(),
highlight: function (code) {
return hljs.highlightAuto(code).value;
},
pedantic: true,
gfm: true,
tables: true,
breaks: false,
sanitize: false,
smartLists: true,
smartypants: false,
xhtml: false
});
$('.markdown').each(function (i, md) {
$(md).html($.trim(marked($(md).find('textarea').val())));
})
hljs.initHighlightingOnLoad();
})
</script>
~~~
如果不能正常解析参考以下代码(去除行首空白):
~~~
<div class="markdown">
<textarea hidden>{{ preg_replace('@(^\s*)@m','',$hdcms['content']) }}</textarea>
</div>
~~~
第三个参数为内容变量
## 替换内容
~~~
editormd.setSelection({line:0, ch:0}, {line:9999, ch:9999});
editormd.replaceSelection("");
~~~
editormd为编辑器对象,需要在callback中获得
- 文档已经迁移到后盾人
- 基础知识
- 项目介绍
- 安装配置
- 日期时间
- 日期选择
- 列表框日期
- 日期区间
- 时间选择
- moment
- 上传处理
- 初始配置
- 图片上传
- 文件上传
- 消息通知
- 消息通知
- Bootstrap消息
- izitoast
- SweetAlert
- 模态框
- 表单管理
- 异步请求
- 表单提交
- 表单验证
- 扩展组件
- GET参数
- 剪贴板
- 表情选择
- 图表
- 拾色器
- 二维码生成
- 光标控制
- 数据验证
- md5
- 设备检测
- Loading
- 预览图片
- 图标库
- COOKIE
- 百度地图
- 城市选择
- Vue.js
- jQuery
- axios
- 播放器
- 幻灯片
- 代码高亮
- 阿里云OSS
- 验证码
- 页面滚动
- lodash
- momentjs
- markdownIt
- 元素页面固定
- 编辑器
- ueditor
- editor.md
- SimpleMDE
- simditor
- 自定义组件
- 1.0(旧版)
- 基础知识
- 作者向军
- 安装配置
- 查看效果
- 元素样式
- 日期时间
- 日期选择
- 日期区间
- 时间选择
- moment
- 上传处理
- 图片上传
- 文件上传
- 后台处理
- 模态消息
- 模态
- notify
- bootstrap
- 表单管理
- 表单提交
- 表单验证
- 表单样式
- 扩展组件
- 自定义组件
- get参数
- 剪贴板
- 表情选择
- 图表
- 拾色器
- 二维码生成
- 光标控制
- 数据验证
- MD5
- loading
- 预览图片
- 图标库
- COOKIE
- 百度地图
- 城市选择
- Vuejs
- jQuery
- 播放器
- 幻灯片
- axios
- 代码高亮
- 阿里云OSS
- 验证码
- 正则表达式
- 工具函数
- 编辑器
- 百度编辑器
- markdown
- simplemde-markdow