将 HTML 文件加载到 ACE Editor PRE 标签中

Question

有一个（在服务器上）本地存储的 HTML 文件，我需要向用户显示该文件并允许用户对其进行更改并保存。（类似于 WordPress 中的模板文件编辑器）。

为此，我使用 ACE 编辑器。

我的 JavaScript 代码：

$(document).ready(function() {

var editor = ace.edit("editor");

editor.getSession().setMode("ace/mode/html");
editor.setTheme("ace/theme/chrome");

editor.setValue("<?php echo addslashes(file_get_contents("abc.html")); ?>");
editor.gotoLine(1);

});

文件 abc.html 中的代码

我的问题：虽然我使用了addslashes，但有些字符会导致问题。没有一种方法可以直接向 ACE Editor 提供文件吗？

有没有其他这样的编辑器可以直接提供文件名来打开？

编辑：解决了！

我没有通过 setValue() 函数传递文件文本，而是直接在 PRE 标记中打印文本

<pre id="editor"><?php echo htmlentities(file_get_contents($input_dir."abc.html")); ?></pre>

有效。

Answer 1

正确的转义是

htmlspecialchars(addslashes(file_get_contents("abc.html")));