如何在我的网站中嵌入 ace 编辑器 [重复]
Posted
技术标签:
【中文标题】如何在我的网站中嵌入 ace 编辑器 [重复]【英文标题】：How to embed ace editor in my website [duplicate] 【发布时间】：2015-11-27 11:47:01 【问题描述】：伙计们，我最近一直在使用 cloud9 ide，我想将 ace 编辑器添加到我的网站。查看 ace 编辑器，这里是链接：http://ace.c9.io/#nav=about
谁能告诉我如何将它嵌入我的网站。 ace编辑器首页给出的教程看不懂
感谢所有帮助。
【问题讨论】：
working example 给你 【参考方案1】：嵌入到您的网站上清楚地显示在网站上： http://ace.c9.io/#nav=embedding
示例：
<!DOCTYPE html>
<html lang="en">
<head>
<title>ACE in Action</title>
<style type="text/css" media="screen">
#editor
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
</style>
</head>
<body>
<div id="editor">function foo(items)
var x = "All this is syntax highlighted";
return x;
</div>
<script src="/ace-builds/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/javascript");
</script>
</body>
</html>
Cloud9 IDE
如果您使用cloud9 IDE，您可以通过..下载编辑器。
Github：git clone git://github.com/ajaxorg/ace.git
鲍尔：bower install --save git clone git://github.com/ajaxorg/ace.git
注意：您需要构建项目。
如果您想使用预构建的，请改用：
https://github.com/ajaxorg/ace-builds.git
示例 这是我对 ace-editor 的设置： https://ide.c9.io/anik786/cloud-9-sandbox
【讨论】：
非常感谢它的工作 不幸的是，这会清除您可能想要显示的所有其他内容。 @JohnnyBizzle：大声笑，只需更改 css 并删除绝对值。 我几乎不会打电话给ace-builds。每个功能都是一个单独的文件（例如自动完成等）。对于语言文件，这很好，但对于每个功能？如果某处或构建器有真正的“预构建”版本，或者甚至是关于如何将pre-built 东西“构建”到单个 js 中的说明，那就太好了。他们的构建器相当懒惰，有很多 **/*.js，所以输出被定向到与输入相同的混乱结构。
这里是上面的sn-p来自：github.com/ajaxorg/ace-builds/blob/master/editor.html以上是关于如何在我的网站中嵌入 ace 编辑器 [重复]的主要内容，如果未能解决你的问题，请参考以下文章