全屏 Ace 编辑器

Question

我正在尝试让我的 ace 编辑器进入全屏模式， 就像 YouTube 可以将其视频全屏显示一样。

有人知道如何做到这一点吗？

Answer 1

您需要调整

editor.container

的大小以覆盖整个页面并调用

editor.resize()

。
像这个

Answer 2

要进入像 youtube 这样的真正全屏模式，请使用

editor.container.webkitRequestFullscreen()

请参阅 https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode 不幸的是，在全屏模式下，浏览器会捕获 esc 键，因此这无法用于多项选择。

Answer 3

2024+ 更新。您可以使用下面的代码在按下

F12

按键时启动全屏模式。 只需调整

editors[editor_instance]

，使其指向您的 Ace 编辑器对象。

editors[editor_instance].commands.addCommand({
    name: "save",
    bindKey: { win: "F12" },
    exec: function(editor) {
        editor.container.requestFullscreen();
    }
});