한 번에 하나의 비디오 만 재생 HTML5

한 번에 하나의 비디오 만 재생하려면 아래 코드를 사용하지만 제대로 작동하지 않습니다. 제발 제안 해주세요. 비디오에 한 번에 하나의 비디오 만 재생 HTML5

클릭 첫 번째 비디오

클릭 두 번째 비디오

를로드

허용 :

document.getElementById("vid1").addEventListener('play', dimBack1, false); 
document.getElementById("vid2").addEventListener('play', dimBack2, false); 
document.getElementById("vid3").addEventListener('play', dimBack3, false); 
document.getElementById("vid4").addEventListener('play', dimBack4, false); 
document.getElementById("vid5").addEventListener('play', dimBack5, false); 
document.getElementById("vid6").addEventListener('play', dimBack6, false); 


function dimBack1() { 
document.getElementById("vid2").pause(); 
document.getElementById("vid3").pause(); 
document.getElementById("vid4").pause(); 
document.getElementById("vid5").pause(); 
document.getElementById("vid6").pause(); 
document.getElementById("vid1").play(); 
} 
function dimBack2() { 
document.getElementById("vid1").pause(); 
document.getElementById("vid3").pause(); 
document.getElementById("vid4").pause(); 
document.getElementById("vid5").pause(); 
document.getElementById("vid6").pause(); 
document.getElementById("vid2").play(); 
} 
function dimBack3() { 
document.getElementById("vid3").play(); 
document.getElementById("vid1").pause(); 
document.getElementById("vid2").pause(); 
document.getElementById("vid4").pause(); 
document.getElementById("vid5").pause(); 
document.getElementById("vid6").pause(); 
} 
function dimBack4() { 
document.getElementById("vid4").play(); 
document.getElementById("vid1").pause(); 
document.getElementById("vid2").pause(); 
document.getElementById("vid3").pause(); 
document.getElementById("vid5").pause(); 
document.getElementById("vid6").pause(); 
} 
function dimBack5() { 
document.getElementById("vid5").play(); 
document.getElementById("vid1").pause(); 
document.getElementById("vid2").pause(); 
document.getElementById("vid3").pause(); 
document.getElementById("vid4").pause(); 
document.getElementById("vid6").pause(); 
} 
function dimBack6() { 
document.getElementById("vid6").play(); 
document.getElementById("vid1").pause(); 
document.getElementById("vid2").pause(); 
document.getElementById("vid3").pause(); 
document.getElementById("vid4").pause(); 
document.getElementById("vid5").pause(); 
} 
</script>

위의 코드는 http://www.confesstalk.com/cl/test.html

홈페이지 reequirement에서 라이브 온라인 첫 번째 동영상 클릭 o, 첫 번째 비디오를 일시 중지합니다. 내가 다른 비디오를 클릭하면

내가 두 번째 비디오를 일시 정지 코드가 필요

출처

2014-07-19 user3142854

그것은 나를 위해 잘 작동 (파이어 폭스 30)가 정확히 제대로 작동하지 무엇입니까? – Oliboy50

몇 가지 순서에 추가 "놀이"가 있습니다.

실제로 .play();을 .addEventListener('play', ...)과 함께 사용할 필요가 없습니다. "이벤트"에 "루프"가 발생할 수 있습니다. 요소에서 이벤트를 실행하는

사용 array은 다음을 참조하십시오

(function() { 
    var videos = [ 
     document.getElementById("vid1"), 
     document.getElementById("vid2"), 
     document.getElementById("vid3"), 
     document.getElementById("vid4"), 
     document.getElementById("vid5"), 
     document.getElementById("vid6") 
    ]; 

    function stopOthers() { 
     var id = this.id, i = 0; 
     for (var j = videos.length; i < j; i++) { 
      if (videos[i].id !== id) { 
       videos[i].pause(); 
      } 
     } 
    } 

    var i = 0; 
    for (var j = videos.length; i < j; i++) { 
     videos[i].addEventListener("play", stopOthers, false); 
    } 
})();

출처

2014-07-19 23:53:23

한 번에 하나의 비디오 만 재생 HTML5

답변

관련 문제