2013-03-17 11 views
13

Próbuję odtwarzać filmy jeden po drugim za pomocą przycisku lub automatycznie na końcu wideo. przez ten kod:

//automatically play 
$("#videoPlayer").bind('ended', function() { 
if(cnt <= 10 && bNum == 0) cnt++; 
$('#videoPlayer').attr('poster','./media/spot'+cnt+'.jpg').html('<source src="./media/spot'+cnt+'.mp4" type="video/mp4"><source src="./media/spot'+cnt+'.ogg" type="video/ogg"><source src="./media/spot'+cnt+'.webm" type="video/webm">'); 
$('#video-title').html('Spot '+cnt); 
if(cnt < 10) { 
    this.load(); 
    this.play(); 
    cnt++; 
} 
bNum = 1; 
if(cnt >= 10) $('.link1').remove(); 
}); 

//Play by the button 
$('.link1').on('click', function() { 
    if(cnt < 10 && bNum == 0) cnt++; 
    $(this).attr('rel', cnt).attr('title', 'Spot '+cnt); 
    $('#videoPlayer').attr('poster','./media/spot'+cnt+'.jpg').html('<source src="./media/spot'+cnt+'.mp4" type="video/mp4"><source src="./media/spot'+cnt+'.ogg" type="video/ogg"><source src="./media/spot'+cnt+'.webm" type="video/webm">'); 
    $('#video-title').html('Spot '+cnt); 
    if(cnt >= 10) $('.link1').remove(); 
    if(cnt <= 10) { 
    if($('#videoPlayer').load()) $('#videoPlayer').play(); 
    cnt++; 
    } 
}); 

część html jest:

<video width="640" id="videoPlayer" autoplay preload="metadata" poster="./media/spot1.jpg"> 
<source src="./media/spot1.ogg" type="video/ogg"> 
<source src="./media/spot1.mp4" type="video/mp4"> 
<source src="./media/spot1.webm" type="video/webm"> 
Your browser does not support the video tag. 
</video></div> 
<ul> 
<li class="link1" rel="2">Nächster Spot </li> 
</ul> 
</div> 

automatyczne część działa dobrze bez błędu. Ale część za przyciskiem dostaje błąd na linii;

$('#videoPlayer').play(); 

z komunikatem

"$(...).play is not a function". 

nie mogę znaleźć, dlaczego. (Dla this.play() Mogę również napisać $('videoPlayer') w automatycznym strony. To jest taka sama).

+0

możliwe duplikat [Play/Pause HTML 5 wideo przy użyciu jQuery] (http://stackoverflow.com/questions/4646998/play-pause-html-5-video-using-jquery) –

Odpowiedz

55

$('#videoPlayer') daje obiekt jQuery i jQuery obiekt nie ma metody play. Metoda odtwarzania, której szukasz, znajduje się w rodzimym elemencie dom wewnątrz obiektu jQuery. Aby uzyskać dostęp do elementu wewnątrz, wystarczy użyć składni tablic lub .get(). na przykład $('#videoPlayer')[0].play(); lub $('#videoPlayer').get(0).play();

+1

To jest to! ** Dziękuję bardzo. ** Nie wiem wystarczająco dużo o tym. – Shenya

+0

Bardzo dobra odpowiedź – Faisal

+0

Dobry żal! Dziękuję za tę odpowiedź. –