2010-10-13 17 views
1

Voici ce que ma page html ressemble (test):Dynamiquement Swap Vidéo Youtube Sans Recharger la page

<div style="width: 640px;"> 
<object width="640" height="385"><param class="movie" name="movie" value="http://www.youtube.com/v/zkd5dJIVjgM"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/zkd5dJIVjgM" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object> 
<ul> 
    <li><a class="btn" href="http://www.youtube.com/watch?v=n3gYWBu1NDI">Video 1</a></li> 
    <li><a class="btn" href="http://www.youtube.com/watch?v=7o53S5JROfg">Video 2</a></li> 
    <li><a class="btn" href="http://www.youtube.com/watch?v=e2ZB-1kDOdQ">Video 3</a></li> 
    <li><a class="btn" href="http://www.youtube.com/watch?v=d-PDXAcUw0s">Video 4</a></li> 
    <li><a class="btn" href="http://www.youtube.com/watch?v=vCH8O1dLSbc">Video 5</a></li> 
    <li><a class="btn" href="http://www.youtube.com/watch?v=Q8kLlNt3Ue4">Video 6</a></li> 
</ul> 
</div> 

et mon jquery ressemble à ceci:

$('.btn').click(function(e){ 
e.preventDefault(); 
var val = $(this).attr("href"); 
$('embed').attr('src', val); 
}); 

Ce que je voudrais faire est être capable de cliquer sur chaque lien dans les éléments de la liste et que cette vidéo répale la vidéo actuelle qui s'y trouve. Chaque clic entraînera donc une vidéo différente occupant la vidéo en haut. Quelqu'un peut-il aider?

Répondre

0

Ce que vous avez devrait fonctionner si vous ajoutez:

$('param[name=movie]').attr('value', val); 
+0

J'ai essayé, mais quand je clique sur une nouvelle URL, elle devient blanche et la nouvelle vidéo ne s'affiche pas à la place de la vidéo précédente. – Tillz

+0

J'ai aussi ce problème. Si quelqu'un connaît la solution, postez une réponse. – thomallen

1

Je ne sais pas si vous l'avez résolu ou non, de toute façon le problème peut être que l'URL dans l'attribut valeur de la balise PARAM a une format différent de celui spécifié dans l'attribut HREF.

<param class="movie" name="movie" value="http://www.youtube.com/v/zkd5dJIVjgM"> 
<a class="btn" href="http://www.youtube.com/watch?v=n3gYWBu1NDI"> 

Je pense que vous devriez passer la balise PARAM une chaîne avec le format approprié, quelque chose comme

http://www.youtube.com/v/VIDEO_ID_HERE

En fait, je ne l'ai pas testé, mais vous pouvez essayer.