• ace editor 使用教程



    <!DOCTYPE html>
    <html>
    <head>
    <title>Demo of ACE Editor</title>
    <!--导入js库-->
    <script src="ace-builds-master/src/ace.js"></script>
    <script src="ace-builds-master/src/ext-language_tools.js"></script>
    </head>

    <body>
    <!--代码输入框(注意请务必设置高度,否则无法显示)-->
    <pre id="code" class="ace_editor" style="min-height:400px">
    <textarea class="ace_text-input">
    #include <cstdio>
    int main(){
    int n,m;
    scanf("%d %d",&n,&m);
    printf("%d",n+m);
    return 0;
    }
    </textarea>
    </pre>

    <script>
    //初始化对象
    editor = ace.edit("code");

    //设置风格和语言(更多风格和语言,请到github上相应目录查看)
    theme = "clouds"
    language = "c_cpp"
    editor.setTheme("ace/theme/" + theme);
    editor.session.setMode("ace/mode/" + language);

    //字体大小
    editor.setFontSize(18);

    //设置只读(true时只读,用于展示代码)
    editor.setReadOnly(false);

    //自动换行,设置为off关闭
    editor.setOption("wrap", "free")

    //启用提示菜单
    ace.require("ace/ext/language_tools");
    editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: true
    });
    </script>

    </body>
    </html>

  • 相关阅读:
    关于vue的一些总结
    mvc中html导出成word下载-简单粗暴方式
    获取ip地址及城市信息
    .net中html转pdf
    div+css布局的问题
    js面向对象总结
    ES5&&ES6
    前端问题总结
    在vue的项目中引入swiper插件
    vue脚手架的使用
  • 原文地址:https://www.cnblogs.com/chiangyibo/p/7423693.html
Copyright © 2020-2023  润新知