Question

我正在尝试通过JavaScript使视频（或其他任何东西）在Edge浏览器中进入全屏模式。但是我无法正常工作。在Chrome中，一切正常。

我尝试了js命令行工具中的所有步骤。通过行document.getElementById("video_player");获取正确的html video元素。然后，我尝试输入命令video.requestFullscreen();，但它没有执行任何操作。甚至没有错误:(

我已在about：标志设置中激活了全屏API，并且我已关闭了所有浏览器扩展。

HTML视频元素不在<iframe>

内

编辑：

这是我的完整代码。 js文件被加载到HTML文档的末尾。如您所见，它现在没有做很多事情。

<iframe>

请，有人可以帮助我让它开始工作吗？我现在在这个问题上浪费了两天。

Answer 1

我用您上面发布的代码进行了测试。

如果您使用代码调用全屏api，我发现您的代码将无法在任何浏览器中使用。

我不确定，如您在原始帖子中所说，它在chrome上如何工作。

如果您参考文档，则可以在下面找到信息。

注意：必须在响应用户交互或设备方向更改时调用此方法。否则它将失败。

参考：

Element.requestFullscreen()

如文档中所述，如果我从代码中调用方法，则Chrome和Edge中的方法都会失败，但是如果用户尝试使用按钮单击来调用它，则该方法会起作用。

示例代码：

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>

<h2>Fullscreen with JavaScript</h2>
<p>Click on the button to open the video in fullscreen mode.</p>
<button onclick="openFullscreen();">Open Video in Fullscreen Mode</button>
<p><strong>Tip:</strong> Press the "Esc" key to exit full screen.</p>

<video width="100%" controls id="myvideo">
  <source src="rain.mp4" type="video/mp4">
  <source src="rain.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

<script>
/* Get the element you want displayed in fullscreen */ 
var elem = document.getElementById("myvideo");

/* Function to open fullscreen mode */
function openFullscreen() {
  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();
  }
}
</script>

<p>Note: Internet Explorer 10 and earlier does not support fullscreen mode.</p>

</body>
</html>

参考：

HTML DOM requestFullscreen() Method

这是有意完成的，因为如果它是从代码中获取工作的，那么那么多的站点会开始显示弹出窗口，而无需用户的许可。这可能会使用户烦恼。

JavaScript requestFullscreen在Edge中不起作用

1 个答案: