zoukankan      html  css  js  c++  java
  • django markdown

    1. 编辑器

    css

    1     <link rel="stylesheet" href="{% static 'plugin/editor.md/css/editormd.css' %}">

    div

    1                 <div id="editormd" class="col-md-10 text-left">
    2                     <textarea name="" style="display: none" id="id_body"></textarea>
    3 
    4                 </div>

    提交使用ajax。初次测试使用post内容提交有误

                        <input type="button" class="btn btn-primary btn-lg" value="保存"
                        onclick="publish_article()">

    js代码

    {% block javasript %}
        <script src="{% static 'plugin/editor.md/editormd.min.js' %}"></script>
        <script>
            $(function () {
                var editor=editormd("editormd",{
                    "100%",
                    height:"640",
                    syncScrolling:"single",
                    path:"{% static 'plugin/editor.md/lib/' %}"
                });
            })
        </script>
    
    
    
        <script>
        function publish_article() {
            var title=$("#id_title").val();
            var columnid = $("#which_column").val();
            var body = $("#id_body").val();
            $.ajax({
                url:"{% url 'article:article_post' %}",
                type:"POST",
                data:{"title":title,"columnid":columnid,"body":body},
                success:function (args) {
                    if(args=="1"){
                        alert("保存完成");
                        location.href="{% url 'article:article_list' %}";
                    }else if(args==2){
                        console.log("todo2")
                    }else{
                        alert("内容有误,重新填写")
                    }
                }
            });
        }
        </script>
    {% endblock %}

    2.查看

    {% block head %}
        <link rel="stylesheet" href="{% static 'plugin/editor.md/css/editormd.preview.css' %}">
    {% endblock %}
    
    
    <div id="editormd-view" >
        <textarea name="" id="append-test" style="display: none">
    {{ article.body }}
        </textarea>
    
    </div>
    
    
    
    {% block javasript %}
        <script src="{% static 'plugin/editor.md/lib/marked.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/lib/prettify.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/lib/raphael.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/lib/underscore.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/lib/sequence-diagram.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/lib/flowchart.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/lib/jquery.flowchart.min.js' %}"></script>
        <script src="{% static 'plugin/editor.md/editormd.min.js' %}"></script>
    
        <script>
            $(function () {
                editormd.markdownToHTML("editormd-view",{
                    htmlDecode:"style,script,iframe",
                    emoji:true,
                    taskList:true,
                    tex:true,
                    flowChart:true,
                    sequenceDiagram:true,
                });
    
            });
        </script>
    {% endblock %}
  • 相关阅读:
    【刷题】BZOJ 3626 [LNOI2014]LCA
    【刷题】UOJ #207 共价大爷游长沙
    【刷题】COGS 2701 动态树
    【刷题】BZOJ 4530 [Bjoi2014]大融合
    【刷题】BZOJ 2959 长跑
    【刷题】BZOJ 1969 [Ahoi2005]LANE 航线规划
    【刷题】BZOJ 4998 星球联盟
    【刷题】BZOJ 1977 [BeiJing2010组队]次小生成树 Tree
    【刷题】BZOJ 4817 [Sdoi2017]树点涂色
    获取元素 在网页中的 坐标
  • 原文地址:https://www.cnblogs.com/infaaf/p/8728075.html
Copyright © 2011-2022 走看看