在iPhone上使用html5视频事件,如何通过简单的暂停告诉"完成"按钮？

Question

我有一个使用HTML5视频标签的iPhone网页.在iPhone上,此类嵌入式视频在本机播放器中播放.我想查看视频何时结束以及用户是否已使用"完成"按钮解除视频.最初,我试过这个:

var video = $("#someVideo").get(0);          
video.addEventListener('ended', myFunction);

但只有在视频被允许完成时才会被解雇.在玩了一些其他事件(暂停,停顿,等待)后,我发现"完成"按钮会触发"暂停"事件.但是,当我添加这个:

video.addEventListener('pause', myFunction);

我的代码是从"完成"按钮称为既与当用户点击的播放控件暂停按钮.第二种情况是不可取的; 我只想要第一个案例,但事件似乎没有给我足够的信息.

有没有人知道如何判断用户何时点击iPhone播放器中的"完成"按钮(而不是简单地暂停)？

Answer 1

只需在暂停功能中检查webkitDisplayingFullscreen布尔值.按"完成"或"暂停"会触发暂停事件,但"完成"会像从全屏模式退出一样进行额外操作.执行该检查将帮助您区分按下2个按钮.下面是一些示例代码.

<script>
var html5Video = function() {
    return {
        init: function() {
            var video = document.getElementsByTagName('video')[0];
            video.addEventListener('ended', endVideo, false);
            video.addEventListener('pause', pauseVideo, false);
        }
    };
}();

function endVideo() { 
    alert("video ended");
}

function pauseVideo() { 
    var video = document.getElementsByTagName('video')[0];
    if (!video.webkitDisplayingFullscreen)
        endVideo(); 
}

html5Video.init();

</script>

Answer 2

这就是你需要的:

yourplayer.addEventListener('webkitendfullscreen', onPlayerExitFullscreen, false);

反之亦然

yourplayer.addEventListener('webkitbeginfullscreen', onPlayerEnterFullscreen, false);

以下是我发现的问题的另一个答案:如何确定HTML5视频播放器何时进入iOS/iPad上的全屏模式？

Answer 3

有一个名为“结束”的事件，您可能应该使用它，请参阅http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#event-media-ending。