HTML视频 - 操作OnEnd无法正常工作

时间:2013-06-04 01:14:31

标签: javascript html5 function video html5-video

我无法使用onended函数处理HTML视频。它不一定是onended但基本上我想在视频结束时发生一系列事情。

代码如下:

<script language="JavaScript" type="text/javascript">
window.onload = playVideo;
function playVideo() 
{
    var video = document.getElementById("video");
    var message = document.getElementById("videoinfo");
    var button = document.getElementById("playpause");
    button.onclick = function()
    {
        if (video.paused)
        {
            video.play();
            button.innerHTML = "Pause";
            message.value = "The video is playing, click the Pause button to pause the video.";
        }
        else
        {
            video.pause();
            button.inerHTML = "Play";
            message.value = "The video is paused, click the Play button to play the video.";
        }
        video.onended = function(e)
        {
            button.innerHTML = "Play";
            message.value = "The video has ended, click Play to restart the video."
        }    
    }
}
</script>

<button type="button" id="playpause" onclick="playVideo()">Play</button> 
<br> 
<video id="video" width="320" height="240">
    <source src="Video/movie.mp4" type="video/mp4">
    <source src="Video/movie.ogg" type="video/ogg">
    Your browser does not support HTML5 video.
</video>
<br />
<textarea id="videoinfo" cols="90">
Click the Play button to start the video.
</textarea>

感谢您的帮助

编辑:我不能发布自己的答案8小时,声望不超过10,所以我必须编辑:

在试图让这个工作2天后,我在这里发布了一个问题,所以我可以弄清楚。不到10分钟后,我设法让它发挥作用。

我在onEnded标记中使用了<video>函数,并将其与名为videoEnded()的javascript函数相关联。

见下文:

<script language="JavaScript" type="text/javascript">
function playVideo() 
{
    var video = document.getElementById("video");
    var message = document.getElementById("videoinfo");
    var button = document.getElementById("playpause");
    button.onclick = function()
    {
        if (video.paused)
        {
        video.play();
        button.innerHTML = "Pause";
        message.value = "The video is playing, click the Pause button to pause the video.";
        }
        else
        {
            video.pause();
            button.inerHTML = "Play";
            message.value = "The video is paused, click the Play button to play the video.";
        }
    }
}
function videoEnded()
{
    var message = document.getElementById("videoinfo");
    var button = document.getElementById("playpause");
    button.innerHTML = "Play";
    message.value = "The video has ended, click Play to restart the video.";
}
</script>

希望这可以帮助其他人。我已经搜索了几天寻找答案,没有什么可行。

由于

1 个答案:

答案 0 :(得分:0)

if(Video.ended)

 // Code when video ends.
编辑:抱歉不提供任何其他解释,但是,您是否尝试过使用.addEventListener方法?你在哪个浏览器中开发/调试?