HTML5 + JS视频 - 多个播放器,每个播放器都有自己的控件

时间:2018-06-13 01:53:02

标签: javascript html5 video

我的页面包含两个HTML5视频播放器 - 每个视频播放器都使用JS自带控制器按钮。

这两组按钮仅适用于其中一个玩家(第二个) - 我知道我需要为每个玩家和按钮命名,但我尝试了很多组合并且无法使其工作。代码如下......

<div style="text-align:center"> 
  <video poster="poster1.png" id="video1" width="90%">
    <source src="video1.mp4" type="video/mp4">
  </video><br>
     <button onclick="playPause()">Play/Pause</button>
  <br><br>
</div> 

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

function myVideo.playPause() { 
    if (myVideo.paused) 
        myVideo.play(); 
    else 
        myVideo.pause(); 
} 
</script> 



<div style="text-align:center"> 
  <video poster="poster2.png" id="video2" width="90%">
    <source src="video2.mp4" type="video/mp4">
  </video><br>
     <button onclick="playPause()">Play/Pause</button>
  <br><br>
</div> 

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

function playPause() { 
    if (myVideo.paused) 
        myVideo.play(); 
    else 
        myVideo.pause(); 
} 
</script> 

1 个答案:

答案 0 :(得分:0)

最简单的方法是将您想要的ID传递给脚本(因此您只需要脚本存在一次):

<unistd.h>