2013-09-24 3 views
0

video.js 프레임 워크를 사용하는 <video> 플레이어의 여러 인스턴스가있는 페이지가 있습니다. 그 중 하나를 연주 할 때 다른 연주 인스턴스를 일시 중지하고 싶습니다. 또는 다른 말로하면 하나를 연주 할 때 다른 모든 연주가 일시 중지되기를 바랍니다.하나를 재생할 때 다른 플레이어 일시 중지

제쳐두고 : 불행히도, 나는 동적으로 생성되기 때문에 video.js 요소의 ID를 모르는 Wordpress 환경에서 이것을 사용하고 있습니다. 또한 jquery에 액세스 할 수 있습니다.

은 HTML 출력처럼 보이는 끝 :

<video id="example_video_id_1984815762" class="video-js vjs-default-skin" width="350" height="198" poster="http://example.com/wp-content/uploads/2013/09/filename.jpg" controls preload="none" data-setup="{}"> 
    <source src="http://example.com/wp-content/uploads/2013/09/filename.mp4" type='video/mp4' /> 
</video> 

나는이 시도했지만, 아무 소용이 :

$('.filmWrapper a').click(function(){ 

    var vidId = $(this).find('video').attr('id'); 

    var myPlayer = videojs(vidId); 

    myPlayer.on('play',function(){ 
    this.siblings().pause(); 
    }); 

    return false; 

}); 

나는

야 확실 해요
  1. 완전히 잘못하고
  2. 내 jquery가 섞여 있습니다. 그리고 videojs는 나쁘게 물건.

이것은 일반적인 사용법입니다. 누군가 어떻게 내게 말해 줄 수 있니?

답변

1

당신은, 먼저 일반적인 클래스를 기반으로 모든 ID를 얻는 시도하고이 라인을 따라

무엇인가 (이 코드를 약간 조정할 수있다 다른 모든 사람을 제어하기 위해 그들 각각에 이벤트를 할당 할 수 있습니다 하지만 대략적인 지침을 알려줄 것입니다.)

var ids, length; 
ids = new Array(); 
jQuery(".video-js").each(function() { 
    ids.push(this.id); 
}); 
length = ids.length; 
for (var i = 0; i < length; i++) { // cycle through all the IDs 
    var otherIDs = ids; 
    videojs(ids[i]).on('play', function() { //the current ID 
    otherIDs.splice(i, 1); //remove the current id from the otherIDs array 
    for (var j = 0; j < length - 1; j++) { //cycle through the otherIDs array 
     videojs(otherIDs[j]).pause(); 
    } 
    }); 
}); 
관련 문제