edit.md编辑器整合步骤
1. 下载editor.md的插件文件
请到我上传的下载资源中,下载 “editormd资源”进行下载
2. 在需要加载插件的界面中,导入相关JS+CSS依赖
<link rel="stylesheet" href="plugins/editormd/css/editormd.css"/>
<script src="plugins/editormd/jquery.min.js"></script>
<script src="plugins/editormd/editormd.min.js"></script>
3. 在界面中,添加如下标签,用于显示编辑器位置
<body>
<div id="test-editormd">
<textarea id="content" style="display:none;"></textarea>
</div>
</body>
4. 编写JS方法,对编辑器进行初始化
var testEditor;
$(function () {
testEditor = editormd("test-editormd", {//加载编辑器外部div的ID值
width: "100%",//设置编辑器的宽度
height: 640,
syncScrolling: "single",
saveHTMLToTextarea: true,//是否以html格式存储
imageUpload: true,//图片上传功能
imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
imageUploadURL: "/markdown/uploadImage.action",//发起存储后台请求
path: "plugins/editormd/lib/",
toolbarIcons: function () {
return ["undo", "redo", "|", "bold", "italic", "quote",
"uppercase", "lowercase", "|", "h1", "h2", "h3", "h4", "|",
"link", "image", "code", "code-block", "|", "watch", "preview",
"fullscreen", "clear"]
}
});
});