1

以前は Ace エディターの作成に成功していましたが、最近 CodeProjects という Web サイトを作成していて、Ace エディターを入れたいと思っていますfunction foo(items) { var x = "All this is syntax highlighted"; return x; }。ページhttp://ace.c9.io/#nav=embedding&api=aceには、コードのみが必要であると書かれています。

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

しかし、それを埋め込もうとすると（または、サイトではなくエディターを作成するだけでも）、再び表示されるだけですfunction foo(items) { var x = "All this is syntax highlighted"; return x; }

助言がありますか？

4

3 に答える 3

1

また、ファイルをプロジェクトにコピーするように指示されています。それをしたくない場合は、cdn のスクリプトを含めます

<script src="//cdn.jsdelivr.net/ace/1.1.01/min/ace.js"
             type="text/javascript" charset="utf-8"></script>

http://jsbin.com/ojijeb/165/editを参照

于 2013-07-29T08:00:28.090 に答える
0

コンテンツをエディター div の外に配置する必要があります[または、AJAX を使用してページの読み込み時にコンテンツを取得します]。どちらの方法でも、JavaScript: を使用してコンテンツをエディターにロードしますeditor.setValue("hello world");。

エディターの高さを設定するには、それが存在する div のサイズを変更してから、エディターのサイズ変更メソッドを呼び出します。

var div = document.getElementById('editor');    
div.style.height = some_multiple_of_the_line_height_for_tidiness;
editor.resize();
于 2014-05-25T18:45:06.283 に答える
0

私の経験では、div を pre に変更する必要があります。次のように div の代わりに pre を使用するだけで問題が解決するはずです。

<pre id="editor" >
</pre>
于 2017-01-13T15:14:03.287 に答える