我可以让mode/javascript
与一起工作
JS
https://github.com/ajaxorg/ace-builds/blob/master/src-noconflict/ace.js
主题
https://github.com/ajaxorg/ace-builds/blob/master/src-noconflict/theme-tomorrow.js
模式
https://github.com/ajaxorg/ace-builds/blob/master/src-noconflict/mode-javascript.js
工人
https://raw.github.com/ajaxorg/ace-builds/master/src-noconflict/worker-javascript.js
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中设置值。
内容是从数据库加载的(即它是"动态内容"),我不确定这是否有区别?
您需要转义html,而不是
<div id="my_ace_editor"><p>html&test</p></div>
应该是
<div id="my_ace_editor"><p>html&test</p></div>
这适用于所有模式,而不仅仅是html
如果您不想转义HTML代码,只需使用具有以下类型和样式集的script
标记
<script type="text/plain" style="display: block;" id="ace-1">
<a href="test.html">hello world</a>
test test
</script>