javascript - 如何在我的网站中嵌入 ace 编辑器

标签 javascript html webpage

<分区>

伙计们,最近我一直在使用 cloud9 ide,我想将 ace 编辑器添加到我的网站。要查看 ace 编辑器,这里是链接:http://ace.c9.io/#nav=about

谁能告诉我如何将它嵌入到我的网站中。看不懂ace编辑器首页给的教程

感谢所有帮助。

最佳答案

嵌入到您的网站上清楚地显示在网站上: 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: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

关于javascript - 如何在我的网站中嵌入 ace 编辑器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32345179/

相关文章:

javascript - 求圆圆周上各点的坐标

javascript - 如何修复未捕获的类型错误对象不是函数

html - 无序列表的 css 问题(与 IE 一样)

xhtml - 我的 web 应用程序的网页布局顺序 - 如果侧边栏以编程方式显示在主要内容之前是否重要?

javascript - 这个 getter-setter 闭包是否有充分的理由以这种方式在其内部对象中声明它的私有(private)属性?

javascript - 灯箱图片最大高度 = 用户屏幕高度

javascript - 如何根据文本长度自动更改字体大小

javascript - Bootstrap Modal block 选择元素

javascript - 如何更改网页上的鼠标指针图标?

html - 在 github 页面中如何撤消主题选择器