javascript - Firefox 不会切换媒体标签中的控件

Question

我正在构建一个自定义 html5-mediaplayer。我使用自定义控件，因此当我创建媒体元素(使用 JS)时，我首先将其设置为controls = false;当视频全屏显示时，我想将控件的值更改为 true，以便它们仅以全屏模式显示。然而，该对象仍处于 false 状态。似乎一旦设置好控件就无法更改。

我错过了什么吗？我怎样才能改变这个值？我尝试过的所有其他浏览器都可以很好地做到这一点(Chromium、Opera、Safari - Linux 和 MacOS)。我发现的所有文档都说这应该可行。

有问题的代码是这样的，两者都不起作用:

function fullscreen()
{
 document.getElementById("cbPlayer_fullscreen").blur(); //fullscreen-button
 var currentMedia = document.getElementById(currentMediaId);

 currentMedia.removeAttribute("controls");
 //currentMedia.controls = true;
 currentMedia.setAttribute("controls","controls");

 // go full-screen
 if (currentMedia.requestFullscreen) { currentMedia.requestFullscreen(); }
 else if (currentMedia.msRequestFullscreen) { currentMedia.msRequestFullscreen(); }
 else if (currentMedia.mozRequestFullScreen) { currentMedia.mozRequestFullScreen(); }
 else if (currentMedia.webkitRequestFullscreen) { currentMedia.webkitRequestFullscreen(); }
}

控制台中没有错误。

感谢您的任何提示!

克里斯

...哦，你可以在这里看到这个东西:https://musicchris.de/?page=media

Answer 1

更改您的 html 以实际调用 fullscreen() 函数:

<a onclick="fullscreen()" class="cbPlayer_fullscreen" href="javascript:">
   <img style="box-shadow: 0px 0px 2px 1px gray;" id="cbPlayer_fullscreen" class="cbPlayer_mediacontrols cbPlayer_fullscreen" src="cbplayer/pics/fullscreen.png" alt="fullscreen" title="fullscreen">
</a>

我还建议你将 js 移动到一个单独的文件:)