我已经尝试了数十种不同的方法数小时，但是都没有成功，例如以下方法：
document.body.addEventListener("keydown", function() {
THREEx.FullScreen.request();
}, false);
那么，这种情况是否可能呢？
我有一个包含在div中的three.js场景项目，我添加了一个按钮以将其拉伸至全屏模式（然后恢复原状）。如果Three.js可以通过一个函数调用来实现这个功能将会很好，但手动添加也并不太困难。
需要考虑的几个问题：
浏览器有全屏模式（在Chrome中按F11），有一个API可以从代码中调用，使浏览器进入全屏模式，因此您可以通过按钮单击来实现。当浏览器进入全屏模式时，选项卡和任务栏都会消失，所有屏幕空间都可用于您的HTML页面。
function openFullscreen() {
var elem = document.getElementById("id-webglcanvas");
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) { /* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
elem.style.width = '100%';
elem.style.height = '100%';
}
Three.js场景（渲染器、画布）位于某个div元素内部。它是由three.js库创建为canvas元素，并附加为子元素使用'appendChild'。检查您的div元素，您将看到canvas子元素。该div元素可以具有自己的宽度和高度，但场景/画布的宽度和高度是使用renderer.setSize函数设置的，与div无关。
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize(sceneWidth, sceneHeight);
var threeJSCanvas = document.getElementById("id-webglcanvas");
threeJSCanvas.appendChild( renderer.domElement );
当您告诉浏览器进入全屏模式时，同时您还希望将场景div的高度和宽度设置为全屏大小（但最重要的是其位置从0,0开始），并且必须将渲染器大小设置为全屏高度和宽度。您可能希望隐藏页面上的其他div元素，例如叠加GUI-因此，您的整个页面实际上只是具有渲染器的div。很可能您已经实现了' onWindowResize '函数，该函数在调整浏览器窗口大小时更改渲染器的宽度和高度。如果是这种情况，您将不得不使此函数与全屏模式友好，因为它将自动调用。因此，请将此函数视为您的盟友。
window.addEventListener( 'resize', onWindowResize, false );
function onWindowResize() {
if ( myGlobalFullscreenModeVariable) {
var elem = document.getElementById("id-webglcanvas");
var sceneWidth = window.innerWidth;
var sceneHeight = elem.offsetHeight;
camera.aspect = sceneWidth / sceneHeight;
camera.updateProjectionMatrix();
renderer.setSize( sceneWidth, sceneHeight );
} else {
// my other resize code
}
}
当用户退出全屏模式时，您必须手动恢复事物。将div和渲染器大小更改回来，显示隐藏的元素等。用户可以通过按ESC键或您的GUI按钮离开全屏模式。您可以定义在全屏模式更改时调用的函数，但是您需要将其添加为事件侦听器。
if (document.addEventListener)
{
document.addEventListener('webkitfullscreenchange', fsChangeHandler, false);
document.addEventListener('mozfullscreenchange', fsChangeHandler, false);
document.addEventListener('fullscreenchange', fsChangeHandler, false);
document.addEventListener('MSFullscreenChange', fsChangeHandler, false);
}
function fsChangeHandler()
{
if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== undefined) {
/* Run code when going to fs mode */
} else {
/* Run code when going back from fs mode */
}
}