Question

我可以mode/javascript使用：

HTML 的

<script src="/static/js/ace/ace.js"></script>

<div class="my_ace_editor">
function foo(items) {
    var x = "All this is syntax highlighted";
    return x;
}
</div>

CSS

#my_ace_editor {
    position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
}

的jQuery

$(document).ready(function() {
    var editor = ace.edit("my_ace_editor");
    editor.setTheme("ace/theme/tomorrow");
    editor.getSession().setMode("ace/mode/javascript");
});

但是在尝试使用以下内容显示HTML时没有任何运气：

HTML 的

<div id="my_ace_editor"><p>test</p></div>

的jQuery

$(document).ready(function() {
    var editor = ace.edit("my_ace_editor");
    editor.setTheme("ace/theme/tomorrow");
    editor.getSession().setMode("ace/mode/html");
});

并添加：

https://raw.github.com/ajaxorg/ace-builds/master/src-noconflict/mode-html.js

如果我输入HTML编辑器，标签和内容会应用语法高亮显示。

但它在加载时没有显示实际的HTML - 它显示的只是test。

没有Firebug错误，我可以看到应该在Firebug中突出显示的实际HTML。

是否需要其他文件或设置？

编辑：如果我使用，我可以在Ace编辑器中正确显示HTML内容：

editor.setValue("<html>test</html>",-1);

但是我需要能够从HTML本身而不是在jQuery中设置值。

内容是从数据库加载的（即它是'动态内容'），我不确定这是否有所作为？

Answer 1

你需要转义html，而不是

<div id="my_ace_editor"><p>html&test</p></div>

应该是

<div id="my_ace_editor">&lt;p>html&amp;test&lt;/p></div>

对于所有模式都是如此，不仅仅是html

Answer 2

如果您不想转义HTML代码，只需使用带有以下类型和样式集的script标记

<script type="text/plain" style="display: block;" id="ace-1">
  <a href="test.html">hello world</a>
  test test
</script>

Ace编辑器中/ mode / html的要求是什么？

2 个答案: