Javascript 如何使用JS/JQuery检测视频是否为全屏？

我到处找了，还没有找到足够清楚的东西

（请注意，大多数答案已经过时，我相信一定有更好的方法。）

我正在努力做到以下几点：

进入全屏后，

标记将取消静音

退出全屏后，

标记被禁用

请理解，我在一个页面中有多个

标记，它们是动态生成的

理想的情况是一个JS/JQuery事件，它监听所有事件的

标记，如果屏幕模式改变，它将切换静音模式

想象一下，我的视频标签是：

<video class="img-fluid mx-auto d-block rounded " src="something.mp4" controls muted loop alt="Article Video">
<video class="img-fluid mx-auto d-block rounded " src="something-else.mp4" controls muted loop alt="Article Video">

但我在任何地方都找不到如何收听全屏活动，我想应该是这样的：

var video = $('.some-video-class');
video.muted = !video.muted;

video.addEventListener('webkitfullscreenchange', function(video){
    var video = $('.some-video-class');
    video.muted = !video.muted;
});

如果有人能帮我找出我做错了什么，我将不胜感激

---

请注意，我正在使用Bootstrap4.3.1和JQuery3.4.1

要使其正常工作，您需要收听

fullscreenchange

事件（包括特定于供应商的版本）。然后，您可以使用

document.fullscreen元素

属性来确定当前全屏显示的视频，并相应地修改

静音

属性。试试这个：

$('video').on('fullscreenchange webkitfullscreenchange mozfullscreenchange', function() {
  this.muted = document.fullscreenElement !== this;
});

这将适用于页面上的任何

视频
元素

这里有一个a中的工作示例，这是必需的，因为代码片段不允许全屏视频。
这正是我需要的。此外，如果有人遇到同样的问题，并且您的视频是通过ajax请求添加的-请确保将此内容包含在
ajax.done（function（）{//here}）
中。谢谢你的帮助，罗里。