ace.js 打造一款属于你的 Web 编辑器,入门文档。

ace.js

(https://github.com/ajaxorg/ace) https://github.com/ajaxorg/ace]
ce 是一个用 JavaScript 编写的独立代码编辑器。我们的目标是创建一个基于浏览器的编辑器,该编辑器匹配并扩展现有本机编辑器(如 TextMate,VIM 或 Eclipse)的功能,可用性和性能。它可以轻松嵌入任何网页或 JavaScript 应用程序中。Ace 是 Cloud9 IDE 的主要编辑者,也是 Mozilla Skywriter(Bespin)项目的继承者。

特点

超过 120 种语言的语法突出显示(可导入 TextMate / Sublime / .tmlanguage 文件)
超过 20 个主题(可导入 TextMate / Sublime / .tmtheme 文件)
自动缩进和突出
可选的命令行
处理大量文件(最后检查,4,000,000 行是上限)
完全可定制的键绑定,包括 VIM 和 Emacs 模式
搜索并替换正则表达式
突出显示匹配的括号
在软标签和真实标签之间切换
显示隐藏的字符
使用鼠标拖放文本
换行
代码折叠
多个游标和选择
实时语法检查器(目前是 JavaScript / CoffeeScript / CSS / XQuery)
剪切,复制和粘贴功能

实用篇

初始化

  • 定义 HTML
  • 编写 JS
<div id="editor">some text</div>
<script src="src/ace.js" type="text/JavaScript" charset="utf-8"></script>
<script>
    var editor = ace.edit ("editor");// 这里不需要加 #
</script>

这样是不能显示的,所有需要加个高度和宽度,例如

#editor {

    width: 500px;
    height: 400px;
}

主题

  • 加入你的主题 JS
  • 写入调用
<script src="src/theme-twilight.js" type="text/JavaScript" charset="utf-8"></script>
<script>
   editor.setTheme ("ace/theme/twilight");
</script>

输入模式

默认情况下,输入的是文本编辑器,如果你想要加入 JavaScript 编辑器,需要加入文件,并且设置模式

<script src="src/mode-javascript.js" type="text/JavaScript" charset="utf-8"></script>
<script>
var JavaScriptMode = ace.require ("ace/mode/JavaScript").Mode;
editor.session.setMode (new JavaScriptMode ());
</script>

销毁

editor.destroy ();
editor.container.remove ();

自动提示语法

editor.setOptions ({
    enableBasicAutocompletion: true,//
    enableSnippets: true,//
    enableLiveAutocompletion: true,// 只能补全
});

监听内容实时输出

editor.getSession ().on ('change', function (e) {

}); 

获得输入内容 editor.getValue ()

设置输入内容 editor.setValue (editorValue);

移动光标 editor.moveCursorTo (0, 0);// 移动光标至第 0 行,第 0 列

编辑内容搜索 editor.execCommand ('find');// 与 ctrl+f 功能一致

提示

评论区 (0)

没有记录
支持 markdown,图片截图粘贴拖拽都可以自动上传。
黑白课堂

黑白课堂

混元大罗金仙 站长创业者玉树凌风每天醒来0收入

查看更多

最新视频课程

Laravel 的 PhpSpreadsheet 包入门

ace.js 打造一款属于你的 Web 编辑器,入门文档。

wap2App 入门讲解,100%速成,全面为你讲解。

Laravel Permission 中文文档

解释 OAuth 2.0 认证 和使用场景说明

Laravel 之 horizon 队列管理界面系统

钻级赞助商