2013-03-17 8 views
13

Provo a riprodurre i video uno dopo l'altro tramite il pulsante o automaticamente alla fine del video. da questo codice:

//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++; 
    } 
}); 

la parte html è:

<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> 

la parte automatica funziona bene senza errori. Ma il pulsante parte per ottiene un errore sulla linea;

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

con il messaggio

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

non riesco a trovare il motivo. (Per this.play() posso anche scrivere $('videoPlayer') nella parte automatica. E 'lo stesso.)

+0

possibile duplicato [PLAY/PAUSE HTML 5 video utilizzando JQuery] (http://stackoverflow.com/questions/4646998/play-pause-html-5-video-using-jquery) –

risposta

55

$('#videoPlayer') ti dà un oggetto jQuery e l'oggetto jQuery non avere un metodo play. Il metodo di gioco che stai cercando è nell'elemento dom nativo all'interno dell'oggetto jQuery. Per accedere all'elemento all'interno basta usare la sintassi dell'array o .get(). per esempio. $('#videoPlayer')[0].play(); o $('#videoPlayer').get(0).play();

+1

Questo è tutto! ** Grazie mille. ** Non ne so abbastanza. – Shenya

+0

Ottima risposta – Faisal

+0

Buon dolore! Grazie per questa risposta. –

Problemi correlati