视频标签事件监听器

Question

我正在开发使用视频标签的视频播放器。 我从播放器中获得的信息是，当有人单击视频时，如果正在播放，则停止播放；如果未单击视频，则停止播放，然后开始播放

下面是我的代码：

 window.onlaod=init();

 function init(){

    BarLenght= 900;
    video = document.getElementById('vid');

    video.addEventListener('click', playOrPause , false);
    alert("hello");

}
function playOrPause(){
     if((!video.paused) && (!video.ended))
     {
        video.pause();
    }
    else{
        if((video.paused) && (!video.ended))
        {
            video.play();
        }
        else{
            video.currentTime=0;
             video.play();
        }
      }

 }

但它不起作用，谁能知道为什么它不起作用..？

Answer 1

Window.onload拼写错误。 您可能想尝试一下。

Answer 2

很难准确指出错误的出在哪里，但是代码中肯定有一些事情会引起问题。 你onload是拼写错误。 另外，您的video变量是在init中分配的。 您尚未为其声明全局变量，因此可能会导致此问题。 根据JS的设计，不带var前缀的变量将被假定为全局变量，但您永远不应假定其为真。 始终在打算使用它们的范围内声明变量。 以下可能会达到目的...

var video = null;

function init(){

    BarLength = 900; //this was misspelled, also I'm not sure what it refers to...
    video = document.getElementById('vid');

    video.addEventListener('click', playOrPause , false);
    alert("hello");

}

function playOrPause(){
    if(!video.paused && !video.ended)
    {
        video.pause();
    } else{
        if(video.paused && !video.ended) {
            video.play();
        } else{
            video.currentTime=0;
            video.play();
        }
      }

 }

window.addEventListener('load', init);

Answer 3

<!DOCTYPE html>
<html>
<body>

<button onclick="play()" type="button">Play</button>
<button onclick="pause()" type="button">Pause</button>
<button onclick="stop()" type="button">Stop</button><br>

<video id="vid" width="" height="">
  <source src="/video.mp4" type="video/mp4">
  Error!
</video>

<script>
var vid = document.getElementById("vid");

function play() {
    vid.play();
}

function pause() {
    vid.pause();
}

function stop() {
    vid.src="/video.mp4";
}
</script>
</body>
</html>

视频标签事件监听器

问题描述

3 个解决方案

解决方案1
0 2016-07-27 07:26:52

解决方案2
0 2016-07-27 07:40:22

解决方案3
-1 2016-07-27 08:02:26

视频标签事件监听器

问题描述

3 个解决方案

解决方案1 0 2016-07-27 07:26:52

解决方案2 0 2016-07-27 07:40:22

解决方案3 -1 2016-07-27 08:02:26

解决方案1
0 2016-07-27 07:26:52

解决方案2
0 2016-07-27 07:40:22

解决方案3
-1 2016-07-27 08:02:26