基于Bootstrap的Markdown编辑器插件
Bootstrap-Markdown是一款基于Bootstrap的所见即所得的Markdown编辑器。Bootstrap-Markdown使用简单，并提供大量的API来控制Markdown编辑器的行为，非常实用。
使用方法
在页面中引入bootstrap相关文件，jquery，以及bootstrap-markdown.min.css和bootstrap-markdown.js文件。
<link href="css/bootstrap.min.css" rel="stylesheet"><link rel="stylesheet" href="bootstrap-markdown.min.css" type="text/css"><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/bootstrap.min.js"></script><script type="text/javascript" src="bootstrap-markdown.js" >< /script> |
HTML结构
使用Bootstrap-Markdown比那家亲的方法非常简单，你只需要在一个<textarea>元素中设置data-provide="markdown"属性，它就可以自动转换为Markdown编辑器。
<textarea name="content" data-provide="markdown" rows="10"></textarea> |
如果要制作一个内联的Markdown编辑器，可以添加data-provide="markdown-editable"属性。
<div data-provide="markdown-editable"> <h3>这是可以编辑的标题</h3> <p>所有在 "markdown-editable" 这个div中的内容都是可以编辑的。</p></div> |
初始化插件
你也可以通过js的方式来初始化该Markdown编辑器插件。
$("#some-textarea").markdown({autofocus:false,savable:false}) |
本地化设置
如果你需要进行本地化设置，需要引入相关的语言包文件。例如中文需要引入bootstrap-markdown.zh.js文件。
<script type="text/javascript" src="locale/bootstrap-markdown.zh.js" >< /script> |
然后在初始化方法中添加language即可。
$("#some-textarea").markdown({language:'fr'}) |
