Javascript 如何检测html5视频是否在线播放

我有一个HTML5视频，上面有一个飞溅的图像。在桌面设备上，我希望单击飞溅图像以使图像消失，并播放视频。在手机上，点击图像将使视频在一个单独的应用程序中播放，因此当用户点击后退返回网页时，我希望飞溅图像仍然存在（普通视频组件，至少在我的Android手机上，相当混乱）

我如何判断视频是“内联”播放还是发布到新的应用程序中？如果它是内联显示的，我将隐藏飞溅图像，如果它被发布到一个新的应用程序中，我不会

一种方法是嗅探用户代理，看看它是否是电话。这不是一个好主意，原因很明显（新手机问世时可能会坏掉，需要在100台设备上测试）。 另一种可能是当我们离开页面跳转到视频播放器或从视频播放器返回时捕获某种事件。但我不知道该抓什么。 我考虑过的另一种可能性是设置一个计时器来检查视频组件的一些属性。。。看看它是否在播放。。。或者别的什么

---

我正在使用jQuery，以防万一。

在iOS上，您的视频元素将具有

webkitDisplayingFullscreen

属性，因此您可以检查它并确定视频是内联的还是全屏的：

var videoFullscreenStatus = document.getElementById("myVideo").webkitDisplayingFullscreen;

当视频全屏播放时，该属性为true，否则为false。因此，从理论上讲，你可以在视频开始播放时立即检查，并相应地设置海报图像

我对Android不太熟悉，但有一个事件，

webkitfullscreenchange

，当它全屏显示时，你可以收听它。不知道这是否适用于手机，我不相信它适用于iOS

---

我知道这是一个老问题，但我希望这能帮助别人

检查是否有

oncanplay

。对于内联播放的视频，它似乎被预设为

null

var playsInline = typeof document.getElementByID('myVid')['oncanplay'] !== 'undefined';

或者作为一个函数

function playsInLine(vidId) {
    return typeof document.getElementByID(vidId)['oncanplay'] !== 'undefined';
}

---

警告：此方法可能无法在所有设备上的所有浏览器中提供正确的输出，并且由于将来的更改，它也可能会提供不需要的结果。但在写这篇文章的时候，无论我在哪里查看（Windows:Chrome 42、IE11、FF36、Opera 29、Safari.Android:Chrome.iPad和iPhone 4S:Safari），我都能找到这个话题。

你找到关于这个话题的任何信息了吗？从今年春天开始，我就一直在寻找一种不使用UA嗅探的解决方案，我一直没有找到答案。对于我的问题，我只是不担心在移动设备上，当你返回网页时，飞溅图像没有出现，客户也没有对此抱怨。谢谢你的回复。我仍然在嗅线绳。。。。我们希望不久会出现一些东西。只是在iOS 6上尝试了这个，document.getElementById（“myVideo”）。webkitDisplayingFullscreen返回false。这可能已经过时了。@RobW：我刚刚在iOS 6和beta 7上试用过，效果如预期。也许你的设置有其他问题？