Bootstrap Markdown
是很不错的Bootstrap主题编辑器,支持 markdown-js, marked 解析,推荐使用marked。 官方文档 http://toopay.github.io/bootstrap-markdown/
如何使用
<form>
<input name="title" type="text" placeholder="Title?" />
<textarea name="content" data-provide="markdown" rows="10"></textarea>
<label class="checkbox">
<input name="publish" type="checkbox"> Publish
</label>
<hr/>
<button type="submit" class="btn">Submit</button>
</form>
集成DropZone.js添加拖拽上传
官方例子中只能添加远程图片,无法上传本地图片,但是可以集成DropZone.js,允许通过拖拽图片上传;
Dropzone.autoDiscover = false;
$("[data-provide=markdown-editor]").markdown({
iconlibrary: "fa",
autofocus:false,
dropZoneOptions:Dropzone.options = {
clickable: false,//to be clickable to select files
acceptedFiles:'image/*',
paramName: "img", // The name that will be used to transfer the file
maxFilesize: 2, // MB
url: "uploader.php",
addedfile: function(file) {
//This is an example of completely disabling Dropzone's default behavior.
},
});
代码可以参考github https://github.com/westhack/Bootstrap-Markdown
demo可参考 https://www.xinrennet.com 各页面