JQuery全屏仅适用于按钮答案

【问题标题】：JQuery full screen only working on buttonJQuery全屏仅适用于按钮
【发布时间】：2015-02-18 16:57:33
【问题描述】：

我正在尝试强制自动全屏（稍后这将仅在移动设备上）我正在使用来自kayahr 的全屏插件并使用以下代码

$('#videoPlayer').on('loadedmetadata', function () {
    $("#videoPlayer").fullScreen(true); // 1
    setTimeout(function () {
        $("#videoPlayer").fullScreen(true); // 2
    }, 3000);
});

$('#fullscreen').on('click', function () {
    $("#videoPlayer").fullScreen(true); // 3
});

1、2 被调用，但没有任何反应。但是当我按下链接到3 的按钮时，全屏get 的调用就像它应该的那样。

有什么线索吗？我唯一的困难是浏览器不希望您在没有用户输入的情况下自动调用全屏。

【问题讨论】：

几个问题：为什么在第一个事件处理程序上调用两次.fullScreen() 方法？您是否尝试使用 CSS 代替？
是videoPlayer <video> 元素吗？
videoPlayer 是一个视频元素，我调用它两次进行测试，一次是在视频加载时直接调用，一次是在超时后（可能视频尚未加载）

标签： javascript jquery html fullscreen

【解决方案1】：

需要从事件处理程序中调用全屏请求，否则它们将被拒绝。

MDN documentation 说。

因此，您无法通过超时或任何其他方法启动全屏。您必须从 JS 事件处理程序请求全屏才能使其工作。如果自定义事件处理程序不基于本机事件，则它们不应工作。

希望对你有帮助。

【讨论】：