一个社区,一个博客少不了一个好的编辑器、而作为程序猿自然少不了 Markdown 编辑器。 其实写这篇就是记录下自己引入的轮子,以免那天需要还得找一圈。
simplemde-markdown-editor 我觉得是一个非常好用的 Markdown 编辑器 ,这里可查看 Demo 效果
npm install simplemde --save页面中引入 simplemde.min.css 和 simplemde.min.js 或者使用 CDN
创建一个文本域 textarea
<textarea name="body" class="form-control" id="MyID"></textarea>JavaScript方式调用
<script>
var simplemde = new SimpleMDE({ element: document.getElementById("MyID") });或者jQuery方式
<script>
var simplemde = new SimpleMDE({ element: $("#MyID")[0] });
</script>toobar 自定义
// Customize only the order of existing buttons
var simplemde = new SimpleMDE({
toolbar: ["bold", "italic", "heading", "|", "quote"],
});
// Customize all information and/or add your own icons
var simplemde = new SimpleMDE({
toolbar: [{
name: "bold",
action: SimpleMDE.toggleBold,
className: "fa fa-bold",
title: "Bold",
},
{
name: "custom",
action: function customFunction(editor){
// Add your own code
},
className: "fa fa-star",
title: "Custom Button",
},
"|", // Separator
...
],
});