JavaScript / HTML5全屏API

Question

<div id="divbody">
    <button id="begin">Click me</button>

    <script>
        $(document).ready(function() {
            $("#begin").click(function() {
                var e = document.getElementById('divbody');
                e.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
            });
            document.addEventListener("webkitfullscreenchange",function(){
                if (document.webkitIsFullScreen) {
                    //alert('a');
                    document.webkitCancelFullScreen();
                }
            }, false);
        });
    </script>
</div>

以下代码基本上应该在进入后立即取消全屏显示。 但是，上面的代码不起作用（例如，它进入全屏显示但不会取消返回）。 但是，通过取消注释webkitfullscreenchange事件处理程序中的警报，它实际上可以取消。

我很难理解为什么会这样。 另外，如何在不使用警报的情况下实现我要执行的操作？

谢谢。

更新

我已经尝试了所有评论，但似乎没有用。 任何帮助，将不胜感激！

Answer 1

诸如alert（）解决问题的问题总是与事件顺序有关。 几乎总是可行的一种解决方案是将有问题的代码放在较短的计时函数中：

window.setTimeout(cancelFull,10);
function cancelFull() { document.webkitCancelFullScreen(); }

UPDATE将setTimeout（）放在侦听器中，以替换当前的CancelFullScreen。

Answer 2

尝试这个：

window.setTimeout(document.webkitCancelFullScreen, 10);