Question

我一直在尝试创建一个代码片段网站，我需要的只是一个漂亮的开源代码编辑器，带有语法高亮。我发现http://ace.c9.io/但是当我通过编辑器脚本传递PHP时它似乎无效;

通过CodeEditor运行的PHP代码：

    <div id="editor"><?php echo 'test'; ?></div>
<script>
    var editor = ace.edit("editor");
    editor.setTheme("ace/theme/monokai");
    editor.getSession().setMode("ace/mode/javascript");
    editor.setReadOnly(true);
</script>

它在编辑框中显示“test”。

如果我使用此代码传递Javascript它可以工作：

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


<script>
    var editor = ace.edit("editor");
    editor.setTheme("ace/theme/monokai");
    editor.getSession().setMode("ace/mode/javascript");
</script>

我需要一个可以轻松输入任何文本/代码的内容，并且它会正确地突出显示它。

Answer 1

如果您在.php文件上运行，它将在编辑器框中显示test。你必须使用html编码来逃避它。

<?php echo htmlspecialchars('<?php echo \'test\'; ?>'); ?>

Answer 2

您需要对<和>字符进行编码，以便它们不会被解释为HTML标记

<div id="editor">&lt;?php echo 'test'; ?&gt;</div>

如果您使用PHP创建页面，则可以使用htmlentities()执行此编码。如果您使用jQuery，$("#editor").text(code)将对其进行正确编码（使用.html()将解释HTML标记）。

如何制作基于Web的代码编辑器

2 个答案: