javascript – 全屏显示捕捉键盘输入似乎无法正常工作

我正在用Three.js制作游戏,我需要获得用户输入.我有两个处理函数;

function press(evt) 
{
    console.log(evt);

    //evt = window.event;
    var code = evt.which || evt.keyCode;

    switch(code) 
    {
        case KEY.W: input.up = true; break;
        case KEY.A: input.left = true; break;
        case KEY.S: input.down = true; break;
        case KEY.D: input.right = true; break;
        case KEY.E: input.e = true; break;
        case KEY.Z: input.z = true; break;
        case KEY.ONE: input.one = true; break;
        case KEY.CTRL: input.ctrl = true; break;
        case KEY.P: input.plus = true; break;
        case KEY.M: input.minus = true; break;
        case KEY.SH: input.shift = true; break;
    }
}

function release(evt)
{
    console.log(evt);

    //evt = window.event;
    var code = evt.which || evt.keyCode;

    switch(code) 
    {
        case KEY.W: input.up = false; break;
        case KEY.A: input.left = false; break;
        case KEY.S: input.down = false; break;
        case KEY.D: input.right = false; break;        
        case KEY.E: input.e = false; break;
        case KEY.Z: input.z = false; break;
        case KEY.ONE: input.one = false; break;
        case KEY.CTRL: input.ctrl = false; break;
        case KEY.P: input.plus = false; break;
        case KEY.M: input.minus = false; break;
        case KEY.SH: input.shift = false; break;
    }
}

我在其他项目中使用它们,并且它们工作正常.这是我附加事件监听器的方式:

document.addEventListener("keydown",press,false);
document.addEventListener("keyup",release,false);

这在网站正常加载时有效,但在网站全屏显示时无效!

这是init()中的while设置;在body onload事件上调用函数

        var init = function()
        {
            started = false;
            isFullscreen = false;

            changeFsstate = function()
            {
                if (isFullscreen == true)
                {
                    isFullscreen = false;

                    game.stop(); //lol
                }
                else
                {
                    isFullscreen = true;
                }
            }

            container = document.getElementById("container");
            document.body.appendChild(container);

            document.addEventListener("keydown",false);
            document.addEventListener("keyup",false);

            document.addEventListener("webkitfullscreenchange",changeFsstate,false);
            document.addEventListener("mozfullscreenchange",false);

            game = new Game(container);
        }

单击播放按钮后,会发生以下情况:

    THREEx.FullScreen.request(self.container);  
    self.renderer.setSize(screen.width,screen.height);

现在,正如我所说,捕获输入工作直到我单击播放按钮(实际上是一个链接),然后控制台只是停止记录事件,就好像它们没有发生一样.

最佳答案
THREEx.FullScreen似乎正在使用此代码

element.webkitRequestFullScreen();

你需要的是这个:

element.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);

看起来像this is Chrome-only.

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...