django之前端富文本编辑器_Meditor)_前端实现富文本编辑器

第一段：简要说明

第二段：Meditor

?1.根据页面展示,你可以判断是否符合你的口味：https://pandao.github.io/editor.md/

上述代码是官网给的使用格式,千万不要以为只要有代码中的三个文件（editormd.css、jquery.min.js、editormd.min.js）就万事大吉了,还需要有path参数（editormd/lib/里面的文件）,如果还不能运行,就对照前端渲染后传递的js、css、font等文件一个一个提取,构建对应的目录；要是嫌麻烦,包里面的所有文件都不动（稍微有一点大）.

<script type="text/javascript">
var testEditor;

$(function() {

    $.get('test.md', function(md){
        testEditor = editormd("test-editormd", {
            width: "90%",
            height: 740,

　　　　　　　　　 # 依赖包的路径,按自己的司机配置
            path : '../lib/',

　　　　　　　　　 # 主题颜色
            theme : "dark",
            previewTheme : "dark",
            editorTheme : "pastel-on-dark",
            markdown : md,
            codeFold : true,
            //syncScrolling : false,
                saveHTMLToTextarea : true,    // 保存 HTML 到 Textarea
                searchReplace : true,
            //watch : false,                // 关闭实时预览
                htmlDecode : "style,script,iframe|on*",            // 开启 HTML 标签解析,为了安全性,默认不开启
            //toolbar  : false,             //关闭工具栏
            //previewCodeHighlight : false, // 关闭预览 HTML 的代码块高亮,默认开启
                emoji : true,
            taskList : true,
            tocm            : true,         // Using [TOCM]
                tex : true,                   // 开启科学公式TeX语言支持,默认关闭
                flowChart : true,             // 开启流程图支持,默认关闭
                sequenceDiagram : true,       // 开启时序/序列图支持,默认关闭,
            //dialogLockScreen : false,   // 设置弹出层对话框不锁屏,全局通用,默认为true
            //dialogShowMask : false,     // 设置弹出层对话框显示透明遮罩层,全局通用,默认为true
            //dialogDraggable : false,    // 设置弹出层对话框不可拖动,全局通用,默认为true
            //dialogMaskOpacity : 0.4,    // 设置透明遮罩层的透明度,全局通用,默认值为0.1
            //dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色,全局通用,默认为#fff

　　　　　　　　　 # 下面上个配置项,是上传图片的配合项,点击上传图片时,不用自己编写代码,就直接可以提交,但要将imageUploadURL设置为自己的上传URL,而且要记得在后端图片上传的

　　　　　　　　　 # 获取对象的键名：editormd-image-file,必须要使用这个键名获取,否则获取不到

                imageUpload : true,
            imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
            imageUploadURL : "./php/upload.php",
            onload : function() {
                console.log('onload', this);
                //this.fullscreen();
                //this.unwatch();
                //this.watch().fullscreen();

                //this.setMarkdown("#PHP");
                //this.width("100%");
                //this.height(480);
                //this.resize("100%", 640);
                }
        });
    });
});
script>

以上就是才源百科小编为大家整理的django之前端富文本编辑器_Meditor)相关主题介绍,如果您觉得小编更新的文章只要能对粉丝们有用，就是我们最大的鼓励和动力,不要忘记讲本站分享给您身边的朋友哦！！