私は同じWebページに4つのビデオを持っており、再生、一時停止のスキップがあります。しかし、お互いにビデオのinterect

Question

私は私のウェブサイト上で4つの異なるビデオを再生したい。しかし、私が2番目のビデオの再生ボタンを押すと、最初のビデオが反応します。ここで

は、これまでの私のコードです：

<button onclick="playVid()" type="button">Play 
Video</button>&nbsp;&nbsp;&nbsp; 
<button onclick="pauseVid()" type="button">Pause 
Video</button>&nbsp;&nbsp;&nbsp; 
<button onclick="location.href = 'http://ivanflo.sytes.net/cms1/index.php? 
page=bipolair';" id="Button01" class="float-left submit-button" >Skip 
Video</button></br> 
<video id="myVideo01" width="100%" > 
<source 
src="http://hetmosterdzaadje.be/ 
Very%20angry%20man%20Destroying%20his%20car%20completely.mp4" 
type="video/mp4"> 
</video> 
<script> 
var vid = document.getElementById("myVideo01"); 
function playVid() { 
vid.play(); 
} 
function pauseVid() { 
vid.pause(); 
} 
</script> 

すべてのスクリプトは、映像コンテンツを除いて同じです。

すべてのスクリプトには独自の「ブロック」がありますが、必要に応じてそれらをすべて1つのブロックに入れることができます。

ありがとうございます！

Answer 1

最初の動画はvid変数にのみ割り当てられます。同じ機能を持つように

はすべて、またはビデオの任意の量を提供し、あなたはそれがより一般的にする必要があります、次のようになることがあります。

<script> 
function playVid(vidID) { 
    var vid = document.getElementById(vidID); 
    vid.play(); 
} 
function pauseVid(vidID) { 
    var vid = document.getElementById(vidID); 
    vid.pause(); 
} 
</script> 

し、HTMLで

<button onclick="playVid('myVideo001')" type="button">Play Video</button> 

ビデオIDを各機能に渡していることに注目してください。