<!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>

ace editor 使用教程的更多相关文章

  1. codemirror和ace editor的语法高亮

    两个javascript库用做在线代码编辑器都是非常优秀的选择 我这两天对这两个类库做了简单的研究,重点是语法高亮的自定义: ace editor的主要思路是生成状态机,从一个startstate开始 ...

  2. 【前端】ACE Editor 简易使用示例

    身为一个早已退役的Oier,当然忘不了当年一个个OJ页面上的代码显示和代码编辑器. 其中,洛谷使用的ACE Editor就是之一,非常的简洁美观.以及实际上在前端页面上搭建一个ACE Editor也是 ...

  3. 【前端】ACE Editor(代码编辑器) 简易使用示例

    身为一个早已退役的Oier,当然忘不了当年一个个OJ页面上的代码显示和代码编辑器. 其中,洛谷使用的ACE Editor就是之一,非常的简洁美观.以及实际上在前端页面上搭建一个ACE Editor也是 ...

  4. 如何用VSCode手动编译Ace Editor

    对于习惯微软VS的用户,可能很不习惯开源社区兴起的前端开发流程.随着NodeJs的兴起,JavaScript已经成为Github上开源项目最多的语言.使用微软提供的VSCode可以很好地利用这些开源项 ...

  5. 【原创】【2】rich editor系列教程。了解document.execommand操作,保存丢失的range,实时反馈样式给工具栏

    [原创][2]rich editor系列教程.了解document.execommand操作,保存丢失的range,实时反馈样式给工具栏 索引目录:http://www.cnblogs.com/hen ...

  6. 在线编辑器ACE Editor的使用

    ACE 是一个开源的.独立的.基于浏览器的代码编辑器,可以嵌入到任何web页面或JavaScript应用程序中.ACE支持超过60种语言语法高亮,并能够处理代码多达400万行的大型文档.ACE开发团队 ...

  7. ACE Editor在线代码编辑器简介及使用引导

    转自博客:https://www.cnblogs.com/cz-xjw/p/6476179.html ACE 是一个开源的.独立的.基于浏览器的代码编辑器,可以嵌入到任何web页面或JavaScrip ...

  8. 【原创】【1】rich editor系列教程。前期准备,兼容

    [1]前期准备,兼容 索引目录:http://www.cnblogs.com/henryli/p/3439642.html rich editor的原理无非是启用iframe的编辑模式或者div的co ...

  9. windows下ACE安装使用教程(转)

    ACE简介:ACE是一个跨平台的用于并发通信的C++框架.它提供了丰富的C++封装器和框架组件.使用ACE,开发者可以开发出高性能,实时的通信服务和应用.ACE利用进程间通信,事件分离,动态链接和并发 ...

随机推荐

  1. HDU4247【瞎搞】

    题意: 给你4个小正方形的边长,让你求一个最小大正方形的边长以至于可以存这么四个正方形. 思路: 比划了一下...就是最大边+次大边,因为他们一定有交集. #include <cstdio> ...

  2. [Xcode 实际操作]九、实用进阶-(13)调用相机并获取拍摄后的图片

    目录:[Swift]Xcode实际操作 本文将演示如何调用相机并获取拍摄后的图片. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit //首 ...

  3. JS自制SEO框架(js案例)

    学习了JS一段时间,自己封装了一些日常码代码需要用到的框架,需要的小伙伴可以参考一下该框架主要功能有:阻止事件冒泡.阻止默认事件.获取元素.添加事件.删除事件.单个事件代理,多个事件代理.清除clas ...

  4. 5本自然语言处理书单-附pdf

    文章发布于公号[数智物语] (ID:decision_engine),关注公号不错过每一篇干货. 自然语言处理(英语:Natural Language Processing,缩写作 NLP)是人工智能 ...

  5. C#Sqlite增删改查

    说到使用数据库的话,无非也就是对数据的增加,删除和修改以及查询.前文已经 创建好了程序,现在我们就可以来具体实现Sqlite的数据操作,增删改查. 第一步,创建连接字符串来连接数据库: private ...

  6. RPC入门

    在校期间大家都写过不少程序,比如写个hello world服务类,然后本地调用下,如下所示.这些程序的特点是服务消费方和服务提供方是本地调用关系. 而一旦踏入公司尤其是大型互联网公司就会发现,公司的系 ...

  7. bzoj 5249 [2018多省省队联测] IIIDX

    bzoj 5249 [2018多省省队联测] IIIDX Link Solution 首先想到贪心,直接按照从大到小的顺序在后序遍历上一个个填 但是这样会有大问题,就是有相同的数的时候,会使答案不优 ...

  8. 洛谷P2047||bzoj1491 [NOI2007]社交网络

    https://www.luogu.org/problemnew/show/P2047 https://www.lydsy.com/JudgeOnline/problem.php?id=1491 也可 ...

  9. 23 在java中使用groovy类

    1       在java中使用groovy类 1.1  直接调用groovy类 在java中调用Groovy类,需要增加Groovy运行时到java的classpath中. pom.xml < ...

  10. ViewPager的使用总结

    这两天公司项目一直需要用到ViewPager来显示各式各样的Banner图,因而再次做了一些总结,不全后续应该还会更新的. 1.ViewPager要想做到一个界面显示多个items 有两种方式 ,一种 ...